axure_1复习8

axure_1复习8

1.制作tab切换效果（方法一）

选项组按钮+动态面板
动态面板 = 每个state一个tab页
选项组：设置各选项组的“选中”状态，点击后选中

截取三个图片 放到同一个动态面板中，该动态面板由上方三个按钮控制。

单击时，设置面板状态为state1/2/3

添加类似鼠标悬停的交互样式 - 选中为白色
设置选中当前元件

一起亮了怎么办？把三个按钮设置为一个组。

2.制作tab切换效果（方法二）

动态面板+热区
动态面板 = 每个state一个tab页
热区：动态面板之外，点击后切换动态面板state

步骤：

1. 把整张界面作为一个动态面板，选项对应三个状态都放到同一个动态面板中
2. 三个选项新增三个热区
3. 新增交互 - 点击时 - 设置动态面板为状态1/2/3

热区 热区 热区
动 态 面 板

修改颜色？只需要在动态面板的每个state里修改即可。

也可以修改一个按钮选中时的大小，很灵活。

3.axure ap8如何设置底部弹窗

按钮+动态面板
点击按钮 动态面板向上滑动弹出
再加x号，显示隐藏，动态面板向下滑动200ms

另一种方法：

1. 弹窗转化为动态面板；
2. 在原图中添加热区，控制动态面板进出；
3. 在进入页面之前，就把动态面板隐藏；

加入移动的动作
移动动态面板 - 到达0 389 - 显示动态面板

加遮罩：黑色框 - 50%透明 - 动态面板内的弹窗置于顶层 - 加载默认进来隐藏 - 点击按钮时展示遮罩到达0，0

点击关闭的时候加两个交互：隐藏自己并且隐藏动态面板（向下滑动）

把按住x遮罩还在的bug优化：点击x遮罩也关闭

4.axure ap8登录方式切换

比如扫描/密码登录切换

一个动态面板，两个状态。
右上角增加热区 - 新建 - 单击时 - 上一项/下一项 - 向后循环
加入两个输入框