Axure常用交互效果五——展开与收回

亲爱的小伙伴，在您浏览之前，烦请关注一下，在此深表感谢！

课程主题：展开与收回

效果描述：通过点击展开/收回按键，屏幕中显示或隐藏内容，并改变布局

应用场景：菜单与子菜单、查询条件扩展、弹窗等

---

步骤一：页面中拖入一个矩形背景，并设计查询条件和按钮等基本素材；

1

2

步骤二：为四个文本框添加提示信息，并更改文本类型

3

4

步骤三：为新增的查询条件添加交互，组合这个查询条件，载入时隐藏

5

6

同时我们也要为新增的小背景条添加交互，载入时隐藏

7

步骤四：组合查询按钮、展开和收回；以上准备工作基本做完了；

8

步骤五：为展开按钮添加交互，单击时——显示查询条件和背景1——移动查询条件

9

10

步骤六：坐标的选择，需要我们模拟新增条件查询预到达位置，并记录下这个坐标；

11

12

步骤七：移动查询组合，到达预计位置，并记录这个坐标

13

14

15

16

在做完以上交互后，我们还要隐藏展开这个按键，并显示收回，调起其他交互；

17

步骤八：为收回添加交互，载入时隐藏收回，单击时——显示展开，隐藏收回——隐藏背景1，隐藏新增查询条件——查询组合回到原位

18

19

20

21

22

最后一步，把收回和展开按钮叠加一起，这样显示出来就很完美了；

23

24

看一下效果吧（良心博主就放操作视频）

---

相关课程直通车：

​​​​​​​Axure常用交互效果五——展开与收回-CSDN直播

Axure常用交互效果三——隐藏与显示_axture 点击效果-CSDN博客

Axure常用交互效果六——滚动效果_axure实现滚动效果-CSDN博客

Axure常用交互效果七——全屏效果_axure左右两边占满全屏-CSDN博客

Axure常用交互设计一——选中效果_axure设置选中效果-CSDN博客

Axure常用交互效果二——拖动效果_axure滑动拖动设计-CSDN博客

---

 如有其他相关问题，欢迎私信沟通，关注  结构化知识课堂-CSDN博客

明天的产品大咖就是你，创作不易，麻烦关注一下，点赞+收藏、感谢大家！