Axure8,设置展示折叠功能

 时间:2024-10-24 11:14:13

1、先添加2个点击区域,组合后命名为a和b。包括点击图标的展开和折叠内容。

Axure8,设置展示折叠功能
Axure8,设置展示折叠功能

2、使用向下和向上的图标来实现点击事件,命名好图标为上和下

Axure8,设置展示折叠功能

3、再添加2个展示区域,组合后命名为a-1和b-1。

Axure8,设置展示折叠功能
Axure8,设置展示折叠功能

4、并设置好4个组件的默认位置,a和b之间设置好合适的间距,a-1和b-1紧跟在a和b组件。

Axure8,设置展示折叠功能

5、因为了控制点击永远只显示一个展示区域,所以用到一个全局变量。打开事件编辑,点击添加全局变量,设置好变量名,并进行赋值表示初始状态。设置的变量为:_OnclickJiancha,赋值为1

Axure8,设置展示折叠功能
Axure8,设置展示折叠功能

6、开始设置每一个的点击事件,先从a中的向下图标开始,点击展开a-1,并隐藏向下图标,显示向上图标 。同时,还要设置b向下移动的距离。如果b-1展开,要隐藏掉;

Axure8,设置展示折叠功能

7、再设置a中向上图标事件,隐藏展开区域,设置变量为0

Axure8,设置展示折叠功能

8、完成a的设置,进行b的设置,类似的操作,先设置向下展开的事件;此时要根据变量来判断是否要对a进行隐藏,所以有2个事件,以变量为条件,添加IF条件。

Axure8,设置展示折叠功能

9、设置向上图标事件,为隐藏b-1

Axure8,设置展示折叠功能

10、我们来看看具体实现的效果。

Axure8,设置展示折叠功能
  • axure怎么制作水泡导航栏?
  • Mac系统如何设置屏幕的旋转角度?
  • 飞书怎么样创建云文档
  • PPT中如何快速给标题添加转换变形效果
  • 遮罩动画(电灯效果)
  • 热门搜索
    我爱阅读手抄报图片 感恩手抄报资料 环保手抄报的内容 英语国庆节手抄报 少年中国说手抄报 小学四年级手抄报 手抄报花边图片 关于心理的手抄报 小学生手抄报制作大全 迎国庆手抄报