返回首页

AxureRP 实现进度条效果实例教程

时间:2013-05-16 23:11来源:2018年最新注册送彩金www.zhixing123.cn 编辑:麦田守望者

进度条效果非常常见,很多软件加载或者页面加载的时候,抑或计时进度显示,如下载上传的进度指示等,都会用到进度条效果。用AxureRP来实现进度条效果,最简单的就是用动态面板来实现,不过这个基本上无论用哪种方法都是要用到动态面板组件的,因为这里涉及到状态改变了,前面我有说过,但凡涉及状态转换或小页面切换效果的时候都需要用到动态面板,这里介绍两种实现方式,一种是最简单的,一种是别人做的示例,个人感觉很复杂,要是在设计的时候思路不清楚的话,第二种很难出效果的。

因为进度条效果实际上也是给人一种视觉差上的效果,因此只要设置好合适的时间差和恰当的状态转换页,就能在动态面板状态切换的时候给人以连贯的进度条效果。所以最简单的实现方式就是,利用一个动态面板,根据演示进度条的长度,等分成若干等份,这里建议等份不要太少,尽量多一些,这样整个效果会比较的平顺。分成了多少个等份就设计多少个动态面板状态页,每个状态页上进度条的填充长度都根据所分比例来设置,唯一要注意的就是顺序,一定要顺序增加或者顺序减少(顺序减少的进度条也是有应用的,如页面倒计时关闭等),这样设置好之后,通过按钮或其他的组件事件去触发让动态面板进行状态转换的动作,间隔等待时间视效果所需决定,以上就是进度条效果的实现原理。

这个设置其实是很简单的,与前面介绍的很多例子有共同之处,只不过状态页的设计不一样而已,因此动态面板的功能还是很多的,利用其基础特性,再加上灵活的状态页设计,就能组合出各种效果。这个方法对熟悉动态面板组件的朋友设置起来应该很容易了,不熟悉的朋友可以看一下源文件。

第二种方法很复杂,这里不做过多的介绍,利用的是动态面板的移动特性,利用两个动态面板的移动产生的遮蔽效果来完成进度条的效果,个人感觉实现难度有点大,需要花很多时间进去,对于快速原型设计的理念来说,这种方式不大合适,毕竟有更简单的实现方式,这里提供这种方法的源文件供大家参考。

顶一下
(0)
0%
踩一下
(7)
100%
标签(Tag):AxureRP AxureRP教程 AxureRP软件下载 AxureRP序列号
------分隔线----------------------------
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片
博聚网