如何使用AxureRP8实现进度条的原型效果

2025-05-26 01:09:13

1、首先打开我们的AxureRP8软件,新建一个空白的页面,命名自定义进度条,用于接下来的操作,如图所示

如何使用AxureRP8实现进度条的原型效果

3、然后设置矩形的大小和位置,设置成同样的坐标,这里我们把背景和进度的坐标和宽高设置为如下图所示的值

如何使用AxureRP8实现进度条的原型效果

4、注意,这个时候我们要将进度的图层放到背景的图层上面,不然效果会被背景遮挡。

如何使用AxureRP8实现进度条的原型效果

6、然后找到元件--设置文本,设置进度文本的元件,设置为隐藏,具体的操作步骤如下如图所示。

如何使用AxureRP8实现进度条的原型效果

8、在上图的基础上,点击宽后面的fx标志,设置载入元件进度的宽度,添加局部变量process,插入函数[[process.width-2]],这里函数一定要加上[[]]的标志,不然识别不了

如何使用AxureRP8实现进度条的原型效果

10、点击AxureRP软件的预览效果,在浏览器中预览我们的进度条

如何使用AxureRP8实现进度条的原型效果
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢