Axure动画教程之“水波涟漪”

　　学会一个小案例，是为了丰富我们的交互原型设计，您可以在此基础上变换出层出不穷的效果!

　　最近在做一个视频通话的项目，刚好需要连线效果，就设计了个“水波涟漪”的效果，先看一下演示。

　　效果大家看到了，很简单，就是一个涟漪的加载效果;颜色将就看吧，不好看你自己调下。

　　开始画原型

　　一、画涟漪的波纹圈

　　1、首先画四个原型，背景透明，边框调到最粗，颜色白色，名称随意起;由大到小尺寸分别是100*100、80*80、60*60、40*40

　　此处我起名为c1、c2、c3、c4

　　2、然后将4个圆形的透明度由大到小依次调整为40%、60%、80%、*

　　3、将4个圆形水平垂直居中

　　二、创建执行动画的动态面板

　　1、从默认组件库里，拖一个动态面板进来，尺寸调小一点，便于操作，给动态面板也起个名称随意

　　2、我们有4个圈要做动画，我计算了一下波形的由隐藏到显示再到隐藏的循环，来回正好需要8次，因此复制创建总共8个动态面板的状态

　　3、接下来添加交互动作，每次切换状态的时候依次从小圈到大圈显示再隐藏，为了让涟漪看起来由快到慢，这里的显示动画也将时间逐步增长处理

　　动作列表

　　操作步骤

　　三、完成封装，添加全局执行命令

　　1、将刚刚创建的所有原件，全选编组，并且起个名称便于操作

　　2、将其中4个圆形，设置为隐藏

　　3、*给刚刚编的组，添加一个加载命令

　　这里的循环间隔时间越长，动画速度越慢

　　ok了，F5看下效果吧!

　　贵阳航洋动漫职业学校是贵阳市教育局批准(贵阳市教[2010]15号)设立的跨专业(包含计算机平面设计、动漫与游戏制作、影像与影视技术、绘画等专业)、多门类、全日制中等专业职业学校，同时也是一所实行准军事化管理的学校。