Axure RP9 滑动开关

一、说明

在APP或小程序设置中心中，我们经常碰到某个属性开关的设置，例如是否接收消息等等，过去的体验中用checkbox实现即可，今天为大家介绍一种交互效果比较好的一种实现方式。接下来会用到两个元件实现该效果。

二、效果展示

链接案例

三、操作步骤

1. 在画布中添加一个矩形大小为56X32，同时设置在样式中设置'圆角'为28，设置背景色为D7D7D7，命名为block;

2. 再往画布中添加一个直径为28的小圆圈，设置背景色为FFFFFF，命名为round;

3. 将原区移动到底部矩形区域中，在左侧偏移4个像素大小；

4. 将圆圈和矩形选中进行组合（快捷键CTRL+G），同时命名为on-off；

5. 接下来为block添加选定背景色，这里选择绿色，颜色可由自己自行而定；

6. 再给组合原件on-off 交互中添加鼠标点击，设置选择/选中，目标原件为当前原件，值为切换；
   

7. 最后再给roun元件中添加选中及未选中交互事件