Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

番茄系统家园 · 2022-11-12 11:03:15

Axure中想要制作动态步骤条效果,该怎么制作呢?下面我们就来看看详细的教程。

软件名称:
Axure RP v8.1.0.3382 Enterprise 中文特别版(附注册机+汉化包+安装教程)
软件大小:
83.2MB
更新时间:
2019-04-26

1、打开Axure,今天教大家使用Axure制作动态步骤条效果,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

2、首先将本次需要使用的元件拖入到工作台中,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

3、然后调整元件的大小和样式,制作出如下图所示的步骤条,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

4、同样的方式,我们再制作出更多的步骤条,便于下面做动态效果使用,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

5、制作完成后,我们右击其中一个步骤条,将其转换为动态面板,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

6、然后复制出3个状态,将其他的步骤条放到不同的状态中,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

7、然后进入到步骤条中,给每一个按钮做交互事件,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

8、同样也给其他状态中的步骤条里的按钮做交互事件,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

9、最后f5预览一下效果,如下图所示。

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

Axure网页怎么制作动态步骤条效果? Axure进度条的制作方法

以上就是Axure制作动态步骤条效果的教程,希望大家喜欢,请继续关注。

相关推荐:

免责声明: 凡标注转载/编译字样内容并非本站原创,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如果你觉得本文好,欢迎推荐给朋友阅读;本文链接: https://m.nndssk.com/rjwt/123713YkBAKU.html
猜你喜欢
最新应用
热门应用