一个应用是由很多个页面构建起来的,每个页面负责单一的功能,共同组成了整个app.
页面之间的组合,有以下4种基本结构:

• 1 模态结构
  模态结构,用于在界面上显示一个与本界面内容无关的内容.比如在商品信息浏览页面,点击购买时,如果没有登录,就会模态地展示登录页面.

• 2 树形结构
  一个页面陈述了若干个主题,然后用若干个子页面分别陈述这些主题.这就是树形结构.

  比如本文配套的Demo,为了说明iWatch页面的跳转3种方式,首先用一个RootController展示了3个入口;每个入口点击后,将展示对应的自内容.

• 3 平铺结构

  多个页面之间显示的是并列关系而不是包含关系的内容.多个页面共同组成了多屏区域的内容.

  比如天气应用,把每个关注的城市的天气信息单独放在一个页面.那么这些页面之间,就构成了兄弟关系.通过左右滑动,来切换显示不同的城市的天气信息.

• 4 标签结构
  标签结构,也是多个页面之间显示的是并列关系而不是包含关系的内容.但是把多个页面,在空间上重叠到了一个页面,只有一屛的内容.通过点击下方的标签按钮来显示不同的内容.

在iWatch界面中,由于内容空间有限,所以没有标签结构的页面.

每种结构的页面之间,有着对应的转场方式:
模态结构的页面,用Present方式转场;
树形结构的页面,用Push方式转场;
平铺结构的页面,用Reload方式转场;

下面,我们分别介绍这3种转场方式.

1 Present

present的效果如下:

转场效果:自下而上弹出
是否有默认的返回按钮:有
适合结构:模态结构
代码实现:

/*
name:在Storyboard中,目标控制器的名字;
context:需要传递给控制器的参数,该参数在控制器的- (void)awakeWithContext:(id)context方法中能获取到.
*/
- (void)presentControllerWithName:(NSString *)name context:(nullable id)context;

手动返回的方式:

- (void)dismissController;

2 Push

push的效果如下:

image

转场效果:源控制器从左至右退出,显示目标控制器;
是否有默认的返回按钮:有
适合结构:树形结构
代码实现:

/*
name:在Storyboard中,目标控制器的名字;
context:需要传递给控制器的参数,该参数在控制器的- (void)awakeWithContext:(id)context方法中能获取到.
*/
- (void)pushControllerWithName:(NSString *)name context:(nullable id)context;

手动返回的方式:

- (void)popController;

3 Reload

Reload的效果如下:

转场效果:直接显示
是否有默认的返回按钮:无
适合结构:平铺结构
代码实现:

/*
names:在Storyboard中,目标控制器的名字,可以指定多个,然后用平铺的方式展现.
context:需要传递给控制器的参数的数组,与控制器名称一一对应.
orientation:目标控制器平铺的方式,水平还是竖直的.
pageIndex:跳转过去之后,首先显示的控制器的序号.
*/
WKInterfaceController的类方法:
+ (void)reloadRootPageControllersWithNames:(NSArray<NSString*> *)names contexts:(nullable NSArray *)contexts orientation:(WKPageOrientation)orientation pageIndex:(NSInteger)pageIndex;

手动返回的方式:
首先用一个变量存储上一次源控制器的名字,然后用该方法重新跳转过去.

注意:

• 该方法没有返回按钮,对于不需要提供返回操作的跳转,非常适合用此方案.

5 总结

本文介绍了iWatch的3种页面转场方式,每个转场方式被设计出来,是为了适用于不同结构的页面之间的过渡.

Present和Push中自带的返回按钮,是隐藏不掉的,如果不需要系统提供的返回按钮,那就只能使用Reload的方式来过渡了.

项目源代码放到百度网盘上了:

链接:https://pan.baidu.com/s/19DeagLAGN1mpx-c_pJb7vQ
密码:48e7

精彩推荐

iOS | iWatch开发 没有转圈的数据请求 是没有灵魂的
MySql | 存储过程(基础) 老板要我一天统计的数据,我3分钟做完了
iOS | app签名 图解苹果app签名流程,深入分析 表弟:我也看懂了!
密码学 | 数字签名 让情敌送情书,网友:心太大了...