时间:2021-05-22
Axure就不多介绍了,一般对产品岗位比较了解的都知道,常用的原型工具。这里为大家做一个用动态面板做简单的banner图片轮播的方法。
一、基础准备工作
1、打开Axure,页面名称命名为“图片轮播”;在左侧部件(线框图)中,选择动态面板,左键选中,并按住左键,拖动其至工作台页面中,如图,在上方菜单栏将宽调整为400,高为200(宽高根据个人需求来自行设置)
2、双击建立的动态面板,弹出“动态面板状态管理”窗口。给当前动态面板起名字为“图片轮播”;在面板状态区域,点击“+”增加状态,需要有几个图片轮播,建立几个状态,在每个状态上,右键,可重命名,当前我们做三个图片轮播的,命名为“图1”“图2“”图3“。完成后,点击窗口的确定按钮。
3、在右侧窗口下方“部件管理”,双击动态面板的状态“图1”;(注意,如果看不到部件管理,可以在菜单栏的“视图”-“面板”设置);在左侧的“部件”,左键选中并拖动一个“图片”放置于当前的工作窗口中。
4、双击图片的图标,弹出选择图片的路径框,这里大家选择需要轮播的图片就可以了,将图片选中后确认即可在工作台窗口打开图片;这里需要大家注意,如果图片的边缘位于当前状态框(虚线)的外面,需要拖动当前图片到虚线内,或者过大的需要裁剪(选中图片,右键可裁剪图片),或者调整图片大小,能将图片放置于虚线框内,否则完成后的原型会无法显示全等问题。
5、设置完成图1后,我们需要用同样的方法设置图2和图3,这里不细说了
6、三个图片均设置完成后,点击左侧上方的“图片轮播“页面,返回主页面,这里我们可以看到之前的动态面板已经默认显示图1的图片了。
二、图片轮播的动态面板设置步骤
1、选中动态工作页面的动态面板,在右侧“部件交互和注释”的“载入时”右键,选择“新增用例”,弹出窗口“用例编辑器”
2、在“用例编辑器”窗口“动态面板”,选择设置面板状态。
3、在第四步“配置动作”,选中“设置图片轮播”,前面会表示√,表示选中;在“选中状态”选择“next”(表示正序轮播)previous(表示倒叙轮播);并选中下面的“从最后一个到第一个自动循环”(这样才能实现一直轮播);可以选择循环间隔时间,亦可以默认不设置。
4、进入时,退出时的动画可以根据需求自行设置,我这里选择了一个进入时,向右滑动,完成后,点击确定按钮。
5、可以F5预览,或者生成原型文件,部分浏览器不支持的,建议大家默认IE。ok了,完成。
相关推荐:
Axure RP 8怎么创建图形母板?
Axure 8.0中怎么制作手机上下滑动效果?
Axure RP 8怎么设置控制多选列表传值的效果?
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
网页中经常能看到轮播图banner,想要制作一个轮播图,该怎么制作呢?我们可以先试用axure制作网页轮播图的原型,该怎么制作呢?下面我们就来看看详细的教程。软
axure是一款强大的原型软件,动态面板也是其常用的元件之一,功能强大。这个经验通过使用动态面板制作一个5秒的动态倒计时来了解一下动态面板的功能。1、打开axu
Axure想要制作一个滚动字幕,与图片右右滚动的相类似,一个动态面板就能实现文字滚动的效果了,具体该怎么制作呢?下面我们就来看看详细的教程。软件名称:原型设计工
动态面板为Axure里常用的元件:本次主要涉及:元件:动态面板、图像,技术点:交互用例、动态面板和图像的编辑,如下面脑图所示:1、打开Axure8(axure7
墨刀组件能达到动态的效果,操作很方便,而且能够长期保存下来,以后可以继续用,该怎么使用墨刀制作axure中动态面板模型呢?下面我们就来看看详细的教程。软件名称: