【Axure原型图】——4.TabControl（选项卡）-创新互联
创建一个结构，在里面点击一个选项卡，可以显示该选项卡的内容。
创新互联2013年开创至今，是专业互联网技术服务公司，拥有项目成都网站建设、网站制作网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元道县做网站,已为上家服务,为道县各地企业和个人服务,联系电话:18982081108Step0: 下载练习文件
在这里下载AxureTraining.rp文件，并用Axure RP打开
Step1: GETTING STARTED
- 打开"Tab Control" 页面
- 该页面包含了两个Tab小部件， Tab1和Tab2, 这两个标签都已经有了“Selected”交互样式
- 该页面同样有两个groups， "Body1"和"Body2"， Body1中包含了Tab1的内容，Body2包含了Tab2的内容
Step2: Make Dynamic Panel(制作动态面板)
- 右击“Body1” group， 选择"Convert to Dynamic Panel"
- 双击刚刚创建的新的动态面板"Dynamic panel"， 打开“Dynamic Panel State Manager”
- 点击绿色的“＋”
- 双击刚刚添加的“State2”来编辑之
- 返回刚刚的“Tab Control”页面，将“Body2”剪切， 然后将“Body2”粘贴到步骤4中的那个“state2”编辑页面中， 然后将“body2”移动到(0,0)位置
Step3: Add Interaction to "Tab1"
给Tab1添加交互
- 返回"Tab Control"页面, 在properties查看器中选择"Tab1" 然后双击Onclick, 添加一个OnClickCase
- Click to add actions列选择"Set Panel State"
- "Configure actions"中，在“Select the panels to set the state”列选择"Set(Dynamic Panel) state to State1， 并将"Select state"下拉菜单中选择State1(默认就是)
- 返回左边"Click to add actions" ， 点击"Set Selected/Checked"
- 在最右列，点击"This Widget" checkbox
- 点击ok
Step4: Repeat for "Tab 2"
将上述的操作给“Tab2”也重复一次，但是要将“Set Panel State”动作选择为“State2”
Step5: Make a selection group
当选中一个tab的时候，另外一个tab应该是未被选中的状态，要实现这个功能，我们需要将tab1, tab2添加到一个“selection group”中，在同一个“SelectionGroup”中，同一个时间，只有一个groups widgets能够被选中。
- 选中“Tab1”和Tab2
- 在Properties tab中，定位到“SelectionGroup”区域，将这两个“Tab1”和“Tab2”命名为“TabGroup”
注: 本人Axure系列的翻译blog仅供个人记录学习，侵删.
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
网站名称：【Axure原型图】——4.TabControl（选项卡）-创新互联
新闻来源：http://mswzjz.cn/article/cdcghj.html