IonicディレクティブとIonic Frameworkを使用したAngular Materialディレクティブ


98

マテリアルデザインでイオンを使用したい。カスタムCSSと角度材料でイオンディレクティブを使用するのに悩まされています

イオン指令を使用すると、次のような多くの効率的な機能が得られることを読みました

  • アプリデータは、他のビューに移動してページに戻った後でも、UIルーターで記憶されます

  • イオンリストアイテムは、表示の高さまでのみレンダリングされ、下または上にスクロールしたときに再利用されます

パフォーマンスが大幅に改善されました。

しかし、イオン指令を使用する場合、それらには材料設計がありません。

アンギュラマテリアルを使用する場合、これらのパフォーマンスの向上、およびモバイルアプリケーションに必要な追加機能はありません。

Angular-materialディレクティブは

<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が角材料プロジェクトの開発に資金を提供しているように見えますが、なぜ角材料はイオンとの使用に互換性がないのですか?

イオンの性能向上と機能を失うことなく、角度材料コンポーネントをどのように使用できますか?

または

イオンで材料設計を使用するためのより良いアイデアはありますか?


ngMaterialとionicが相互に機能するようになるまで、しばらく時間がかかります。Ionicは常にiOSもサポートする必要があります。Ionixがデザイン的にどこに向かっているかはわかりません。プロジェクトが始まったとき、彼らはアプリがすべてのプラットフォームで同一に見えることを望んでいました。彼らは少し前にその目標をかき集め、今では求人公募によって示されるより多くのプラットフォームの継続性に向かいます。マテリアルデザインへのロードマップについて、開発者に直接質問することをお勧めします(Ionicフォーラムは質問に適した場所です)。
MarkusMüller2015年

1
私はイオンフォーラムに投稿しましたが、運がありません。Googleアプリの一部は、AndroidとiOSの両方でマテリアルデザインを使用しています。しかし、私は現在アンドロイドに興味があります。iOSのは、より多くのコストがかかり、毎年ある:(それはちょうど、IOSに参加するために私のようなスターターのを阻止する私は、IOSの開発者アカウントの制限された電荷を使うべきだと思う。。。
Vamsi

彼らは近い将来にv1後のロードマップを発表すると確信しています。
MarkusMüller2015年

回答:


71

MaterializecssというマテリアルデザインのCSSフレームワークを見つけました。それは有望に見えます。それは単なるCSSとJavaScriptフレームワークです。

http://materializecss.com/

他のフレームワークに対する利点

  1. 純粋なCSSクラスは、イオンディレクティブと競合しません。パフォーマンスの低下はありません。
  2. 私が見たすべてのフレームワークの中で、これはマテリアルデザインルールに厳密に従っている唯一のフレームワークです。
  3. ほぼ準備ができており、約50以上のコントリビューターが現在のバージョン0.95.3で6か月未満で
  4. 使いやすい。機能ごとのナビゲーションで十分に文書化されています。
  5. アプリに必要なほぼすべてのマテリアルデザイン機能を備えています。

このページhttp://materializecss.com/getting-started.htmlでは、プロジェクトに組み込む方法を示します。

これが、優れたマテリアルデザインフレームワークを探しているすべての人に役立つことを願っています。

更新:2015-07-09

マテリアルデザイン用の軽量で強力な美しいCSSフレームワークをもう1つ見つけました

マテリアルデザインライト http://www.getmdl.io/

軽量でスムーズなアニメーションがあり、見栄えが良いです。これは、Googleの開発者の1人によって作成されました。公式にgoogle https://developers.google.com/web/で宣伝されてい ます。かなり人気が出てきましたので、ぜひお試しください。Angular Materialとの比較

更新:2015-10-23

Ionic2には、Androidのマテリアルデザインのサポートが組み込まれています

それは公式です、あなたはAngularConnectでIonic2デモを見ることができます、それはAndroidのデフォルトとしてマテリアルデザインを持っています。マテリアルデザインフレームワークの選択について心配する必要はありません。


1
これの大きな問題は、jQueryが必要なことです
darryn.ten

1
CSSが必要です。ポップアップ、モーダル、その他の機能はイオン性で存在します。したがって、イオニックではないJavaScript機能を具体化しようとしない限り、jqueryはほとんど必要ありません。
Vamsi 2015年

マテリアルデザインライトgetmdl.ioを使用してフィードバックがありますか?イオン+マテリアルデザインについて同じ問題と質問があるので、ここでカムします。したがって、ライブラリに関するフィードバックをいただければ
Javier Salinas

個人的には使用していませんMaterial Design Lightが、有望そうです。ここでの比較であるMaterial Design Lightbootstrap tutorialzine.com/2015/07/comparing-bootstrap-with-mdlは、あなたはそれが役立つブートストラップを使用している場合は、。グーグルのウェブ開発者ページでこれを宣伝している。ですから、それで十分でしょう。
Vamsi

25

Ionic Materialと呼ばれるかなり新しいプロジェクトがあります。

私はそれを試してみましたが、それはかなりうまくいきますが、それはまだ「プレリリースプレビュー」モードにあることに注意してください。

githubリポジトリによると、2015年4月にAlphaに入る予定です。

バウアーで取り付け可能

bower install ionic-material

それだけで十分ですが、警告があります。バグがあり、ドキュメントは基本的に存在しません。

幸運を!


9
以前にイオン材料ライブラリを見たことがありますが、問題は1です。利用可能なドキュメントはありません。2.これは活発に開発されておらず、十分なサポートがありません。今日見られるように、1人の男だけが7日間それに取り組んだ。だから、保証なしで本番アプリでハードに使用します。3. Angular-material、ionicは、資金とサポートの両方が優れており、非常に優れた開発者が良いペースで取り組んでいます。だから私は彼らを信頼できる。
Vamsi 2015年

3

Ionic MaterialIonic Material Design Liteは、イオンフレームワークの拡張を目的とした2つの新しいライブラリです。少し未熟ですが、イオン成分でうまく機能し、材料のテーマを適切にサポートします。

これはおそらくより多くの洞察を与えるでしょう。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.