原型设计：[2]如何实现TAB切换时按钮变换样式

1、今天的设计目标：当鼠标移动到TAB标签按钮时，按钮样式发生改变（红底白色加粗字体），当点击按钮切换显示内容后，按钮样式发生改变（黄底黑色加粗字体）最终显示如下：

2、编辑鼠标移入按钮时的样式选中按钮“作业批阅结果”，右键>>编辑按钮形状>>编辑悬停样式，在弹出的“设置悬停样式”对话框中选择填充色，字体颜色，瑕铆幌约加粗等效果，勾选对话框底部的“预览”功能，能够预览设置完时候的样式（需要设置成什么样式可根据自己的设计）

3、使用格式刷批量设置样式设置完一个按钮，还有另外两个按钮需要设置，这时候可以利用格式刷，类似于word中格式刷的功能，能够将部件的样式批量进行设置（注意：不能利用格式刷复制部件的操作和大小）。

4、设置按钮点击后（被选中）的样式选中按钮“作业批阅结果”，右键>>编辑按钮形状>>编辑选中样式，在弹出的对话框中设置第二种样式（黄底黑色加粗字体），如下图：

5、生成原型预览在预览中我们发现，当鼠标滑过这三个按钮时，按钮变换样式，但是点击某一个按钮进行内容切换时，却没有显示选中的样式，如何让按钮点击后改变样式呢？

6、设置按钮点击后改变样式选中第一稍僚敉视个按钮“作业批阅结果”，然后再右侧事件编辑栏中选中“onclick（点击时）用例1”进行编辑（注意：前面已经添加了一个事件，点击时显示对应的内容），在弹出的对话框中选择“设置部件为选中状态“，在右侧选择按钮”作业批阅结果“后确定，如下图

7、完成步骤6后预览效果，此时部件点击后变换了样式（如下图1），不过当再点击第二个按钮时却不能取消掉上一个被选中的样式（如下图2），怎么办呢？

8、指定按钮组选中本次TAB切换中的三个按钮，右键>>编辑按钮形状>>指定按钮组，在弹出的对话框中输入按钮组名称，例如“查看作业按钮组“，如下图：

9、完结，预览本小结最终效果

10、本节建议这个例子用到了一个部件的操作涉及到另一个部件的属性的相关功能，因此建议大家养成对部件命名的好习惯，不然在后面做复杂交互设计的时候，会很头疼，比如，在一堆没有名字的部件列表中你找不到目标了……