目录
前言
本篇讲解Axure的元件库,从中抽取了一个动态面板的元件单独进行分享介绍
一.动态面板介绍
在Axure中,动态面板是一种功能强大的交互设计元素,用于创建交互式原型和模拟应用程序的动态效果。它可以模拟用户在应用程序中进行的各种操作和状态变化。
1.1 作用
- 展示交互流程:通过动态面板,可以展示应用程序中的不同页面和状态之间的切换和交互流程,帮助用户更好地理解应用程序的功能和操作方式。
- 模拟用户操作:通过动态面板,可以模拟用户在应用程序中的各种操作,如点击按钮、滑动页面、填写表单等,让用户能够体验应用程序的交互效果。
- 反馈用户状态:通过动态面板,可以根据用户的操作和选择,实时更新页面的内容和状态,提供及时的反馈和引导,增强用户体验。
二.动态面板的入门教程----以轮播图为例
首先将 ① 动态面板拖入显示区,② 双击动态面板,然后将图片放入里面,这个时候如果想要面板的长宽随着图片的长宽的变化,选择右边的样式,③勾选上自适应内容和100%宽度
双击图片,选择图片,即可,接着Copy4份,就像下方图片左边那样有4个状态,每个状态选择不同的图片
可以在图片上添加箭头方向,用来切换图片,①选中动态面板 ,点击图标 给图标设置交互事件
选中单击事件 ②目标选中动态面板(这里是给动态面板编辑的名字) ③选中上一项,勾选向前循环,④点击确认即可。相同,另外一个图标一样但是设置的是下一项,向后循环
效果展示:
三.案例
3.1 erp登录案例
① 在显示区拖入矩形,在里面用文本标签写入短信登录和登录登录两种方式登录,作为标题
②在文本标签(短信登录,登录登录)下面分别放入一个动态面板,放入一个比较粗的下划线
③再分别给两个文本标签(短信登录,登录登录)设置交互事件
④在下面放入一个动态面板,里面放矩形,用来装不同 文本标签(短信登录,登录登录)下的页面,最后添加交互事件即可
效果演示:
3.2 erp的左侧菜单栏案例
分析:外面是一个大个动态面板,里面就是一个模块一个面板
①先将一个最外层的动态面板拖入里面
②放一个小的动态面板放在最外层面板里面,并在里面添加矩形,里面输入字段
③在一级菜单字段后面添加图形,用来点击进行菜单栏的收缩(设置交互事件在图形上)
效果展示:
3.3 erp公告栏案例 