我想在材料设计中使用离子。我被困在使用自定义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不兼容?
如何在不失去离子的性能改进和功能的情况下使用角材料组件?
或
有没有更好的想法来使用离子材料设计?
我发现了一个名为Materializecss的材料设计CSS框架。看起来很有希望。它只是简单的CSS和javascript框架。
http://materializecss.com/
相对于其他框架的优势
- 纯CSS类,不会与Ion指令冲突。没有性能损失
- 在我见过的所有框架中,这是唯一一个严格遵循材料设计规则的框架
- 几乎准备好了,它有大约50多个贡献者,在不到6个月的时间里达到了当前版本0.95.3
- 易于使用。有完善的功能导航文档
- 它几乎具备应用程序所需的所有材料设计功能
本页http://materializecss.com/getting-started.html将向您展示如何将其包含在您的项目中。
我希望这能帮助你们中的任何人寻找一个好的材料设计框架。
更新:2015-07-09
我发现了另一个轻量级强大漂亮的CSS框架用于材料设计
材料设计灯 http://www.getmdl.io/
它重量轻,动画流畅快速,看起来很不错。它是由谷歌的一个开发者制作的。它由谷歌官方推广https://developers.google.com/web/.它越来越受欢迎,试试看。与Angular Material 的比较
更新:2015-10-23
Ionic2内置支持Android中的材料设计
它是官方的,你可以在AngularConnect中观看Ionic2演示,它的材料设计是Android的默认设置。我们不需要担心选择材料设计框架。
有一个相当新的项目叫做离子材料。
我已经试过了,效果很好,但请注意,它仍处于"预发布预览"模式。
根据github回购协议,它应该在2015年4月进入阿尔法。
可以安装bower
bower install ionic-material
这几乎就是你需要做的全部,但请注意,存在漏洞,文档基本上不存在。
祝你好运!
这可能会提供更多的见解。