axure轮播图怎么做(动态加轮axure轮播图怎么做)

Axure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档

Axure RP的使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师、UI设计师等,另外,架构师、程序员也在使用Axure。作为专业的原型设计工具,它能快速、高效的创建原型,同时支持多人协作设计和版本控制管理 。

Axure rp9

接下来我们来讲一下如何使用这个软件做出原型轮播图,方法包括以下几步:

步骤一:创建动态面板

首先打开Axure rp软件,会直接进入到page1,就是一个新的文件页面。

Axure rp初始化界面

现在开始我们的正文了,我们先简单拉一个矩形,然后选中点击右键出现选项卡,选择创建动态面板。

创建动态面板

步骤二:给动态面板添加四个状态

接下来,我们看到界面右侧那里有页面和大纲的两个切换卡,点击大纲

界面右侧

然后找到动态面板那一层,鼠标悬停在状态1,会出现一个小图标,这个小图标是复制动态按钮,点击就能直接复制出一个状态了。

大纲

我们复制多两个看看,效果如下图所示。

三个状态

步骤三:在四个状态里设置元件内容

上图看到了,每个状态下都已经含有一个矩形了,当然你要删除也没事,如果不删除,你要添加元件进去的时候,把它覆盖掉也可以。

当然我这里先不删除,先给大家试试轮播效果,可以分别选中每个矩形,把颜色填充换一下。

换颜色

颜色换好以后我们开始下一步,选中动态面板,选择第三个横向滚动,当然你想纵向也可以。

设置滚动

步骤四:选中动态面板新建交互

设置滚动之后还不可以轮播,我们还需要选中动态面板设置交互,也是重点步骤,我们在右侧就可以找到设置交互的选项栏:

新建交互

(1)点击新建交互,下拉找到载入时选项,当然也可以直接搜索载入时

点击载入时

(2)选择了载入时后会直接跳出事件选项卡,在里面找到设置面板状态。

点击设置面板状态

(3)选择设置面板状态后,进行最后的动画添加处理,目标元件选择(动态面板),状态选择下一个,设置从最后一个到第一个自动循环,设置动画效果,这个想怎么滑动按个人发挥,循环间隔看自己的设定,我这里设置1000毫秒。之后就完成了所有的设置了。

设置动画效果


接下来我们点击右上角绿色的图标,点击跳转浏览器查看预览效果。

预览按钮

这是我设的三个矩形,如果你们想要图片轮播,可以直接在动态面板的每个状态里加图片,我这里直接用矩形演示。

轮播a

(0)
打赏 微信扫一扫 微信扫一扫

相关推荐

本文内容由互联网用户自发贡献,该文观点仅代表作者本人,不代表万网时代立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 qulianxi@foxmail.com 举报,一经查实,本站将立刻删除。