手册版本 V5.0
动画介绍
01. nvue 模式不支持 css 动画，使用 weex animation 模块来实现;
提供 weex.animation 示例，请理解原理并改进使用; 相关文档 : https://weex.apache.org/zh/docs/modules/animation.html#transition
02. vue 环境下动画库基于 animate.css , 以样式形式提供了多种动画预设效果;
兼容平台
| H5 | APP | 小程序 | NVUE |
| ✔ 样式模式 | ✔ 样式模式 | ✔ 样式模式 | ✔ js api 模式 |
vue 模式预设动画效果
| 动画样式名称 | 效果 |
| bounce | 回弹 |
| flash | 闪烁 |
| pulse | 脉冲 |
| rubberBand | 橡皮筋 |
| shake | 晃动 |
| headShake | 摇头 |
| swing | 摇摆 |
| tada | 缩放加摇摆 |
| wobble | 大幅度摇摆 |
| jello | 果冻 |
| heartBeat | 心跳 |
| bounceIn | 跳动进入 |
| bounceInDown | 向下飞入 |
| bounceInLeft | 左侧飞入 |
| bounceInRight | 右侧飞入 |
| bounceInUp | 向上飞入 |
| bounceOutDown | 向下飞出 |
| bounceOutLeft | 左侧飞出 |
| bounceOutRight | 右侧飞出 |
| bounceOutUp | 向上飞出 |
| fadeIn | 渐变进入 |
| fadeInDown | 渐变向下进入 |
| fadeInDownBig | 渐变向下进入大幅度 |
| fadeInLeft | 渐变左侧进入 |
| fadeInLeftBig | 渐变左侧进入大幅度 |
| fadeInRight | 渐变右侧进入 |
| fadeInRightBig | 渐变右侧进入大幅度 |
| fadeInUp | 渐变向上进入 |
| fadeInUpBig | 渐变向上进入大幅度 |
| fadeOut | 渐变消失 |
| fadeOutDown | 向下淡出 |
| fadeOutDownBig | 向下淡出大幅度 |
| fadeOutLeft | 左侧淡出 |
| fadeOutLeftBig | 左侧淡出大幅度 |
| fadeOutRight | 右侧淡出 |
| fadeOutRightBig | 右侧淡出大幅度 |
| fadeOutUp | 向上淡出 |
| fadeOutUpBig | 向上淡出大幅度 |
| flip | 快速翻转 |
| flipInX | 水平翻转 |
| flipInY | 垂直翻转 |
| flipOutX | 水平翻转后消失 |
| flipOutY | 垂直翻转后消失 |
| lightSpeedIn | 光速侠进入 |
| lightSpeedOut | 光速侠消失 |
| rotateIn | 旋转进入 |
| rotateInDownLeft | 旋转左下为轴 |
| rotateInDownRight | 旋转右下为轴 |
| rotateInUpLeft | 旋转左上为轴 |
| rotateInUpRight | 旋转右上为轴 |
| rotateOut | 旋转淡出 |
| rotateOutDownLeft | 旋转左下为轴淡出 |
| rotateOutDownRight | 旋转右下为轴淡出 |
| rotateOutUpLeft | 旋转左上为轴淡出 |
| rotateOutUpRight | 旋转右上为轴淡出 |
| hinge | 合页 |
| jackInTheBox | 动态盒子 |
| rollIn | 滚动进入 |
| rollOut | 滚动淡出 |
| zoomIn | 缩放进入 |
| zoomInDown | 向下缩放进入 |
| zoomInLeft | 从左缩放进入 |
| zoomInRight | 从右缩放进入 |
| zoomInUp | 向上缩放进入 |
| zoomOut | 缩放消失 |
| zoomOutDown | 向下缩放消失 |
| zoomOutLeft | 从左缩放消失 |
| zoomOutRight | 从右缩放消失 |
| zoomOutUp | 向上缩放消失 |
| slideInLeft | 左侧滑入 |
| slideInRight | 右侧滑入 |
| slideInUp | 顶部滑入 |
| slideOutDown | 底部滑出 |
| slideOutLeft | 左侧滑出 |
| slideOutRight | 右侧滑出 |
| slideOutUp | 顶部滑出 |
演示代码
UNI 普通版本
NVUE 版本
登录并购买 GraceUI 后可以查阅完整手册内容 。
