一般来说我们在Axure软件启动程序或者安装程序都会有一个加载进度的显示，属于一个缓冲的效果。有的加载是圆形的，而我们今天要实现的是百分比的进度条加载，即计算机在处理任务时，实时的，以图片形式显示处理任务的速度，完成度，剩余未完成任务量的大小，和可能需要处理时间，一般以长方形条状显示。
Axure实现百分比进度条这一过程相对来说还是比较复杂的，因为我们要在Axure中实现一个动态的进度条。www.axurechina.cc/download.html
1.首先我们拖入一个矩形元件，将其命名为进度条，高度为36。然后再拖入一个矩形，宽度设为1，高度也为36，命名为进度指示条：
2.然后将矩形“进度指示条”拖入矩形“进度条”内框，与之对齐，边框设为红色，如下图所示：
3.接着再拖入一个矩形元件，用作百分比的展示，首先初始值为0%，命名为百分比，将其隐藏：
4.拖入一个指示按钮，输入文字“开始”，这个按钮的作用，是在单击之后显示进度百分比的那个矩形框：
5.添加用例，鼠标单击时，显示矩形框“百分比”。除此之外，我们还需要设置进度指示条的宽度等于进度条的宽度，就是逐渐从0到100的过程，让宽度变宽，最后和进度条的宽度相等，所以我们需要设置一下进度指示条的尺寸，宽度等于进度条的宽度，添加一个局部变量，元件-进度条，再添加变量[[LVAR1.wicth]]：
6.变量值值完之后点击确定，添加一个“摇摆动画”，时间为3秒：
7.点击开始显示百分比，添加用例“显示时”。首先设置等待为0，起到刷新的作用，然后设置文本“当前元件”，等于指示条的宽度/总宽度，所以需要添加两个变量，第一个是指示条的宽度，第二个为总宽度，设置如图所示：
8.然后设为隐藏再显示才会触发这个效果，然后将函数改为如图所示，宽度/宽度。
9.全部设置完成之后以下为预览的效果：
以上就是关于Axure实现百分比进度条的设置方法，如果有更多感兴趣的可以关注我们Axure中文网www.axurechina.cc/。
本文来源于：http://www.axurechina.cc/help/1251.html
网友评论