基于Axure RP8实现的一些简单交互

Tab选项卡实现

如何实现如下图所示点击a,b,c三个按钮实现上方图片的切换

（1）首先我们先放置三个矩形框建立整体布局

（2）在大的矩形框上面放置动态面板，这是实现图片切换的重要条件（实现banner轮播同样需要这一步骤），本次例子是实现三张图的切换，所以再增加两个状态，点击右下角动态面板点击加号添加状态，如下图所示操作

（3）添加完三个状态后，为每个状态添加一张图片，例如双击state1进入面板状态state1，然后添加自己需要的图片，如下图操作，state2，state3操作同上

（3）接下来我们再来设置a,b,c三个切换键，为了使页面加载完a切换键就是黄色并且点击任意切换键该切换键会显示黄色，我们来进行如下操作：设置a键，将属性框下的选中勾中（为了实现页面加载完a键就显示为黄色），然后点击鼠标按下设置事件，设置填充颜色，点击确定，设置完成。b,c键除了不勾选中外，剩下的和a键操作相同。

（4）接下来实现点击三个按键后图片进行切换功能，还是先设置a键，在右边属性栏交互事件里双击鼠标单击时进入事件编辑，如下图，点击设置选中，将abc三个矩形选中，a为true，其他两个为false（设置b键b为true，设置c时c为true其余为false），设置完后再设置面板状态，具体操作如下图，在a键设置下，选择状态为state1，进入动画退出动画按自己的喜好选择，bc键设置下选择状态分别为state2，state3

（5）通过以下设置，这个交互事件设置也就完成了，按下F5可以进入网页查看设置后的效果。

         感谢查看，如有错误和意见请大家多多指点！