Axure动态面板的基本操作

目录

一、什么是动态面板

二、了解动态面板

三、轮播图

3.1 操作

3.2 效果

四、多方式登录

4.1 操作

4.2 效果

五、左侧导航栏

5.1 操作

5.2 效果

---

一、什么是动态面板

动态面板是Axure中使用频率最高的元件之一，动态面板专门用于设计原型中的动态功能，它可以包含一个或多个状态，每个状态就是一个页面，在这里可以任意编辑，通过控制状态的切换或显示/隐藏来实现一些我们常见的交互效果。

二、了解动态面板

拖出来以后点击状态就进入到默认状态里，在画布或者概要里均可以去添加和修改状态名，点击隔离指的是只显示动态面板里的内容，不显示动态面板外面的内容。

三、轮播图

3.1 操作

        1、首先需要拖出一个动态面板；

        2、实现几张图片轮播，就建立几个状态。并将各图片直接放入各状态中

        3、开始设置交互事件

首先设置交互，点击动态面板。

点击右侧功能栏的交互，并新建交互，添加动态面板事件已载入，添加设置面板状态操作

3.2 效果

四、多方式登录

4.1 操作

1.矩形要在动态面板中，把动态面板放到账号登录的位置，选择自适应模式

2. 复制状态2 ，把动态面板放到短信登录的地方，然后给对应的元件还有动态面板取名

3. 新建交互，选择交互的方式，把账号以及短信登录的信息在动态面板中写出来 ，在对应的交互地方双击添加更多的交互，如图所示：

4.增加更多的交互

4.2 效果

五、左侧导航栏

5.1 操作

1. 在大的动态面板中放入小的动态面板，然后放入对应的元件，记得给每个元件都取上对应的名字，易于区分。会议管理是一级菜单，其余是二级菜单。

2. 复制状态， 取名为收起状态，除了一级菜单留下，把其余的二级菜单删了，在一级菜单的地方放入一个元件，用于进行交互 。(分清楚展开和收起的状态)

4. 运行时发现会议管理一级菜单在点击收起的时候出现了留白，选中进行交互的元件，双击打开交互编辑器，选中设置面板状态，勾选推动和拉动元件。把每个进行交互的元件都如此操作一次，再次刷新就没有留白了。

5.2 效果