AngularJS材质设计没有动画支持，如何实现

AngularJS Material Design does not have Animations support, how to achieve?

本文关键字：何实现实现支持动画 AngularJS 更新时间：2023-09-26

我正在使用AngularJS制作一个混合应用程序，并希望它基于Material Design UI原则。我一直在谷歌网站上阅读有关此内容的信息。他们已经解释了很多关于材料应该经历的自然动画。我喜欢此页面上的演示。

http://www.google.com/design/spec/material-design/introduction.html

但是，支持开源项目 Angular Material Design 对这些动画没有任何指令或规定。我怎样才能实现这个动画请指导。

我打算使用 CSS3 动画来做到这一点。我应该如何使用它们以及架构应该是什么，请提出建议。

如果你还没有决定，Materialize（http://materializecss.com）是一个基于Material Design的CSS框架，非常易于使用。它的结构类似于Bootstrap。动画具有立方缓动，使其具有自然的感觉。

不确定这是否会对您有所帮助，但是已经基于Material Design http://material-ui.com 构建了一个CSS框架

你可以使用 famo.us。下面是一个概念证明：

http://blog.aminjam.com/building-mobile-apps-with-famous-and-angular-material/

Angular Material Project不提供动画，但总的来说，对于AngularJS，我发现以下包非常有用

NG-FX

您可以简单地安装此包并将其作为依赖项注入，然后添加动画就像将特定类添加到我们的 HTML 中一样简单。

您仍然需要浏览材料设计指南，并确定哪些动画适合以及应该在哪里使用它们。

尝试使用这个

https://material.angularjs.org

"Angular Material 项目是 Material Design in Angular.js 的实现。该项目提供了一组基于材料设计系统的可重用、经过良好测试和可访问的 UI 组件。

与Polymer项目的Paper elements集合类似，Angular Material在Google内部得到了Angular.js，Material Design UX和其他产品团队的支持。