axure6 iPhone子标签标题栏案例

freeqs · 发表于 2011-6-3 14:03:14

这是iPhone周目画报-专栏版的一个导航案例，用于同一个栏目下有多于5个并列版块的切换的一种解决方案，下面是axure来制作心得分享

需要实现的功能：

1. 子标题栏可以实现相互间的切换，选择一个子标题的时候后其他的子标题切换成非选择状态

2. 当选择4.5.6子标题的时候，选中标题会移动到居中位置。

Axure实现方法：

把它的结构分为两层:整个子标题栏组合做成一个动态面板，还有里面独立的子标题按钮（如下图）

第一个功能：首先设置每个按钮的选中状态（全选，右键-编辑按钮形状-选中），设置一个样式，然后把他们编组（编辑按钮形状 -- 设置选择组 --如下图_给个名字）

之后设置按钮的onClick事件，将每个按钮点击后设为当前选中状态（下图为子标题1的设置）

第二个功能：同样在刚才子标题按钮的onClick事件，选“移动动态面板”，设置标题栏组合的动态面板位置，（这里得到一个经验，移动选项设置绝对位置，避免用相对位置，因为当连续点击的时候相对距离会出现偏差，造成位置错位）