Ant Motion —— 蚂蚁金服动效语言& 动效解决方案 | 软件推介

长按上图识别二维码报名济南源创会

Ant Motion

授权协议:MIT

开发语言:JavaScript

操作系统:跨平台

开发厂商:阿里巴巴

Ant Motion 是从蚂蚁金服的 Ant Design 中提炼出来的动效语言。它不仅仅是动效语言，同时也是一套 React 框架动效解决方案，提供了单项，组合动画，以及整套解决方案，帮助开发者更容易的在项目中使用动效。

通过 React 标签，以简单的配置即可完成想要的动画，可以快速的实现不同组合的动画效果，更好的提高你的工作效率。

列表的增删间的动画（http://motion.ant.design/exhibition/demo/list-anim）

详细说明的切换动效（http://motion.ant.design/exhibition/demo/detail-switch）

列表交换位置的动效（http://motion.ant.design/exhibition/demo/list-sort）

图片详细缩略间的切换动效（http://motion.ant.design/exhibition/demo/pic-details-anim）

Ant Motion 在界面里主要是来加强体验舒适度、描述层级关系、增加界面活力、反馈与意向等功能性的动效。详情查看 http://motion.ant.design/language/basic。

rc-tween-one 单元素动效执行组件

这是个对单个元素标签做动效的组件，可以执行所有样式动画，包括 transform3d，模糊等效果，还可以完成贝塞尔曲线动画，具体参数请参见 API

rc-animate 样式进出场组件

对单个元素根据状态进行动画显示隐藏，需结合 css 或其它第三方动画类一起使用；具体参数请参见 API

rc-queue-anim 队列进出场组件

通过简单的配置对一组元素添加串行的进场动画效果。具体参数请参见 API

rc-scroll-anim 随滚动执行效果组件

通过简单的配置，对页面里的元素添加随滚动条滚动的动画。具体参数请参见 API

rc-banner-anim banner 切换效果组件

通过简单的配置, 就能让你的 banner 动起来。 具体参数请参见 API

这是以 Ant Motion 的 React 组件遵从 Ant Design 的视觉规范来完成的 demo 页面，可灵活又快速的配置出你想要的首页模板。

主要提供了单元素示例与配置完后的整页示例。

生成首页在 dva-cli 里运行的例子：https://github.com/ant-motion/ant-motion-dva-cli-example

查看详细：http://t.cn/RIGA89W

安装：

启动：

访问 http://127.0.0.1:8111 。

更多软件推介请前往公众号菜单栏“读我”->“软件推介”查看。