【Axure】动态面板实现B端TAB切换。

前言：一个产品小白的漫漫漫漫学习道路，仅以文章记录在各种网站上学习并实践的成果。文章有自己的一些拙见（真的是拙见），仅供我自己理解，若有错误或者理解不正确的，期望不吝赐教，狠狠指出，我会虚心接受滴，不甚感谢~画原型用的版本是axure8。

 1、在B端常见系统左侧tab切换，要实现这个效果就要用到动态面板。先放一下效果图。

 2、开始制作了

a.选择矩形，宽200长40。一个黑底白字名称一级菜单，下面三个黑字白底，分别命名加以区别。

b.选择下面三个设置交互样式，鼠标悬停填充颜色，选中填充颜色。这两个颜色不要一样，点击确定。

解释：设置交互样式后一定要添加交互事件，添加的交互样式才能生效。

 c.还是选中下面三个，鼠标右击设置选项组，并填写名称：选项组。可随意命名。

d.选中‘选项一’，鼠标右击选择----选中 。

e.选中‘选项一’，添加交互----鼠标单击时，选择----选中，以及矩形框（选项一）。

下面两个矩形也添加交互，复制步骤 e 即可，注意选中的是对应的矩形框。

 

 以上操作效果：

 

f.选中下面三个，右键转化为动态面板。

g.选中‘一级菜单’，添加交互----鼠标单击时，选择----显示/隐藏，选中动态面板，切换，置顶层，推动拉动元器件。

h.选中动态面板设置为隐藏。且全选复制再复制两个。后面两个的‘选项一’就不要选中了。完成。

 

 预览即如下：

额，一篇写下来还挺费劲儿的，动态面板还有很多的功能没有开发，我会慢慢学习的，基于上面的步骤，实现的效果，我就不举一反三了，哈哈，see you~

放一个我可爱的乔巴，托尼托尼-乔巴

---