Ionic Framework를 사용한 Ionic 지시문 VS Angular 재료 지시문

98

머티리얼 디자인과 함께 ionic 을 사용하고 싶습니다 . 사용자 정의 CSS 및 각도 재료 와 함께 이온 지시문을 사용하는 사이에 붙어 있습니다.

나는 이온 지시문을 사용하여 다음과 같은 많은 효율적인 기능을 얻는다는 것을 읽었습니다.

  • 앱 데이터는 다른보기로 이동하고 페이지로 돌아온 후에도 UI 라우터로 기억됩니다.

  • Ionic 목록 항목은 디스플레이 높이까지만 렌더링되며 아래 또는 위로 스크롤 할 때 재사용됩니다.

그리고 많은 성능 향상.

그러나 이온 지시문을 사용하면 재료 디자인이 없습니다.

앵귤러 머티리얼을 사용하면 이러한 성능 향상과 모바일 애플리케이션에 필요한 추가 기능이 없습니다.

각도 재료 지시문은 다음과 같습니다.

<md-list>
  <md-item ng-repeat="item in items">
    Hello, {{item}}!
  </md-item>
</md-list>

이온 지시문은 다음과 같습니다. 

<ion-list>
  <ion-item ng-repeat="item in items">
    Hello, {{item}}!
  </ion-item>
</ion-list>

Ionic이 각도 재료 프로젝트 개발에 자금을 지원하고있는 것 같습니다 . 그렇다면 각도 재료가 이온과 함께 사용할 수없는 이유는 무엇입니까?

Ionic의 성능 향상 및 기능을 잃지 않고 각도 재료 구성 요소를 어떻게 사용할 수 있습니까?

또는

ionic과 함께 머티리얼 디자인을 사용하는 더 좋은 아이디어가 있습니까?

javascript  angularjs  ionic-framework  ionic2  material-design 
— Vamsi
소스
ngMaterial과 ionic이 서로 작동 할 때까지 다소 시간이 걸립니다. Ionic은 항상 iOS도 지원해야합니다. Ionix가 디자인 측면에서 어디로 향하고 있는지 잘 모르겠습니다. 프로젝트가 시작되었을 때 그들은 앱이 모든 플랫폼에서 동일하게 보이기를 원했습니다. 그들은 얼마 전에 그 목표를 긁어 냈고 이제는 더 많은 플랫폼 연속성으로 향하고 있으며 이는 채용 공고에서도 볼 수 있습니다. 머티리얼 디자인에 대한 로드맵에 대해 개발자에게 직접 물어볼 수 있습니다 (Ionic 포럼이 좋은 곳입니다).
— Markus Müller
1
운없이 ionic 포럼에 게시했습니다. 일부 Google 앱은 Android와 iOS 모두에서 머티리얼 디자인을 사용하고 있습니다. 하지만 저는 현재 안드로이드에 관심이 있습니다. 아이폰 OS 비용이 더 많이 매년 :(입니다 그냥 나를 IOS 가입처럼 스타터의 내가 IOS 개발자 계정에 대한 제한 충전을 사용한다고 생각 낙담...
— Vamsi
가까운 장래에 v1 이후 로드맵을 발표 할 것이라고 확신합니다.
— Markus Müller

답변:

71

Materialisecss로 알려진 머티리얼 디자인 CSS 프레임 워크를 발견했습니다 . 유망 해 보인다. 단순한 CSS 및 자바 스크립트 프레임 워크입니다.

http://materializecss.com/

다른 프레임 워크에 비해 장점

  1. 순수 CSS 클래스는 ionic 지시문과 충돌하지 않습니다. 성능 손실이 없습니다.
  2. 내가 본 모든 프레임 워크 중에서 머티리얼 디자인 규칙을 밀접하게 따르는 유일한 프레임 워크입니다.
  3. 거의 준비가되었습니다. 약 50 명 이상의 기여자가 있습니다. 6 개월 이내에 현재 버전 0.95.3입니다.
  4. 사용하기 쉬운. 기능 현명한 탐색으로 잘 문서화되었습니다.
  5. 앱에 필요한 거의 모든 머티리얼 디자인 기능이 있습니다.

이 페이지 http://materializecss.com/getting-started.html 은 프로젝트에이를 포함하는 방법을 보여줍니다.

좋은 머티리얼 디자인 프레임 워크를 찾는 분들에게 도움이되기를 바랍니다.

업데이트 : 2015-07-09

머티리얼 디자인을위한 가볍고 강력하고 아름다운 CSS 프레임 워크를 찾았습니다.

머티리얼 디자인 라이트 http://www.getmdl.io/

가볍고 부드럽고 빠른 애니메이션을 가지고 있으며 꽤 좋아 보입니다. Google 개발자 중 한 명이 만들었습니다. google https://developers.google.com/web/에서 공식적으로 홍보합니다 . 꽤 인기가 높아지고 있습니다. Angular Material과의 비교

업데이트 : 2015-10-23

Ionic2는 Android에서 머티리얼 디자인에 대한 내장 지원을 제공합니다.

그것은 공식입니다, 당신은 AngularConnect에서 Ionic2 데모를 볼 수 있습니다 , 그것은 Android의 기본으로 Material Design을 가지고 있습니다. 머티리얼 디자인 프레임 워크를 선택하는 것에 대해 걱정할 필요가 없습니다.

— Vamsi
소스
1
이것에 큰 문제는 jQuery를 필요로한다는 것입니다
— darryn.ten
1
CSS 만 있으면됩니다. Popup, 모달 및 기타 기능이 이온에 존재합니다. 따라서 jquery는 ionic이 아닌 materialize javascript 기능을 사용하지 않는 한 대부분 필요하지 않습니다.
— Vamsi 2015 년
Material Design Light getmdl.io를 사용하여 피드백이 있습니까 ? 여기에 이온 + 재료 설계에 대한 동일한 문제와 질문이 있습니다. 그래서 많은 라이브러리에 대한 피드백 감사 것
— 하비에르 살리나스
나는 개인적으로 사용하지 않았다 Material Design Light, 그것은 유망 해 보인다. 다음은 Material Design Light그리고 bootstrap tutorialzine.com/2015/07/comparing-bootstrap-with-mdl 의 비교입니다 . 부트 스트랩을 사용했다면 도움이 될 것입니다. Google은 웹 개발자 페이지에서이를 홍보합니다. 그래서 충분해야합니다.
— Vamsi
25

Ionic Material 이라는 상당히 새로운 프로젝트가 있습니다 .

나는 그것을 시험해 보았고 꽤 잘 작동하지만 여전히 "Pre-Release Preview"모드에 있다는 것을 알려드립니다.

github repo 에 따르면 2015 년 4 월에 Alpha에 진입해야합니다.

정자와 함께 설치할 수 있습니다.

bower install ionic-material

이것이 당신이 할 필요가있는 모든 것입니다. 그러나 경고를 받으십시오. 버그가 있고 문서는 기본적으로 존재하지 않습니다.

행운을 빕니다!

— darryn.ten
소스
9
이전에 이온 재료 라이브러리를 본 적이 있지만 문제는 1입니다. 이것은 거의 완료되지 않았습니다. 사용 가능한 문서가 없습니다. 2. 현재 개발 중이 아니며 좋은 지원도 없습니다. 오늘 본 것처럼 7 일 동안 한 사람 만 작업했습니다. 따라서 보증없이 프로덕션 앱에서 사용하기 어렵습니다. 3. Angular-material, ionic은 모두 좋은 자금과 지원을 가지고 있으며 아주 좋은 개발자들이 좋은 속도로 작업하고 있습니다. 믿을 수 있습니다.
— Vamsi
3

Ionic Material 과 Ionic Material Design Lite 는 이온 프레임 워크의 확장을 목표로하는 두 개의 새로운 라이브러리입니다. 약간 미숙하지만 이온 성분과 잘 작동하며 재료 테마를 잘 지원합니다.

이것은 아마도 더 많은 통찰력을 줄 수 있습니다.

— 바르나
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.