首页
登录 | 注册

【Axure原型图】—— 4. Tab Control(选项卡)

创建一个结构,在里面点击一个选项卡,可以显示该选项卡的内容。

Step0: 下载练习文件

在这里下载AxureTraining.rp文件,并用Axure RP打开


Step1: GETTING STARTED

  1. 打开"Tab Control" 页面
  2. 该页面包含了两个Tab小部件, Tab1和Tab2, 这两个标签都已经有了“Selected”交互样式
  3. 该页面同样有两个groups, "Body1"和"Body2", Body1中包含了Tab1的内容,Body2包含了Tab2的内容

Step2: Make Dynamic Panel(制作动态面板)

  1. 右击“Body1” group, 选择"Convert to Dynamic Panel"
  2. 双击刚刚创建的新的动态面板"Dynamic panel", 打开“Dynamic Panel State Manager”
  3. 点击绿色的“+”
  4. 双击刚刚添加的“State2”来编辑之
  5. 返回刚刚的“Tab Control”页面,将“Body2”剪切, 然后将“Body2”粘贴到步骤4中的那个“state2”编辑页面中, 然后将“body2”移动到(0,0)位置


Step3: Add Interaction to "Tab1"

给Tab1添加交互

  1. 返回"Tab Control"页面, 在properties查看器中选择"Tab1" 然后双击Onclick, 添加一个OnClickCase
  2. Click to add actions列选择"Set Panel State"
  3. "Configure actions"中,在“Select the panels to set the state”列选择"Set(Dynamic Panel) state to State1, 并将"Select state"下拉菜单中选择State1(默认就是)
  4. 返回左边"Click to add actions" , 点击"Set Selected/Checked"
  5. 在最右列,点击"This Widget" checkbox
  6. 点击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能够被选中。

  1. 选中“Tab1”和Tab2
  2. 在Properties tab中,定位到“SelectionGroup”区域,将这两个“Tab1”和“Tab2”命名为“TabGroup”


注: 本人Axure系列的翻译blog仅供个人记录学习,侵删.

本文网址:http://www.bnee.net/article/99329.html

相关文章

  • 发现以下3个比较好的资源,初级入门直接看就行主站http://www.webppd.com/thread-1835-1-1.htmlhttp://www.heguangming.com/?p=507/http://www.woshipm.c ...
  • Windows窗口消息大全,全不全自己看 ////////////////////////////////////////////////////////////////////////// #include "AFXPRIV.H ...
  • CTRL组合键 Ctrl + A 全选 Ctrl + B 整理 收藏夹 Ctrl + C 复制 Ctrl + D 删除/添加收藏 (在Word中是修改选定字符格式,在IE及傲游中是保存为收藏) Ctrl + E 搜索助理 在Word中是段落 ...
  • CTRL组合键 Ctrl + A 全选 Ctrl + B 整理 收藏夹 Ctrl + C 复制 Ctrl + D 删除/添加收藏 (在Word中是修改选定字符格式,在IE及傲游中是保存为收藏) Ctrl + E 搜索助理 在Word中是段落 ...
  • CTRL组合键 Ctrl + A 全选 Ctrl + B 整理 收藏夹 Ctrl + C 复制 Ctrl + D 删除/添加收藏 (在Word中是修改选定字符格式,在IE及傲游中是保存为收藏) Ctrl + E 搜索助理 在Word中是段落 ...
  • 怎样在Eclipse中筛选由System.out语句打印的内容
        首先在Eclipse中显示Log Cat选项卡,如果没有的话可以使用下面的方法显示:单击Eclipse的菜单 "Window" --> Show View --> 点击"LogCat&quo ...
  • 这里主要是总结一下我自己用到过的不同类之间指针的获取方法: 1.基于对话框的应用程序,通过菜单命令来显示一个模态对话框: 该模态对话框如何获取主对话框的指针,在模态对话框类需要调用主对话框处添加如下代码: 2.基于对话框的应用程序,通过菜单 ...

2020 bnee小站 webmaster#bnee.net
12 q. 0.067 s.
湘ICP备19013596号-2