正文
最近用手机发现一个很有意思的交互，可以看下面的GIF图。iOS中，有的二级页面是横向切页，有的是纵向切页。于是乎很想知道它们的区别，花了一晚上求助Google，有了初步的答案，跟大家分享。
一、结论
-
纵向切页：这个不是二级页面，而是模态视图，默认使用从下至上切入。
-
横向切页：这个是常规的二级页面切换。
为什么iOS交互中，有的二级页面是横向切页，有的是纵向切页？
二、模态视图（Model View）
下面引用苹果iOS 11人机交互规范来解释模态视图。
模态视图的最主要用途，是防止用户在完成必要的任务之前去做其他事情。简而言之，就是在一个用户流程中，如果有必要的任务加进来，那就要弹出模态视图，做完了再回到原有的正常流程中。
所以我们可以看到很多这样的例子。比如系统设置中，首页与Touch ID设置页，分别是上下级页面的关系，但是在进入Touch ID设置页前，先要验证密码。所以验证密码这步，就交给了模态视图。验证完了，再让你回到原有的流程中。还有我们很熟悉的淘宝，在浏览宝贝时突然来了卖家的消息，这时点进IM界面，就是用模态视图承载的，跟卖家聊完了，退出模态视图，你继续逛。下图是苹果官方用作模态视图介绍的例图。
模态视图主要的形态有Action Sheet、Alerts、Activity View等。当模态视图出现在屏幕上时，用户必须通过点击相应按钮或者退出模态来做出选择。模态视图可以占据整个屏幕，就像一整个父试图（原文是Parent View，有交互的同学可以告诉我有没有更好的翻译），比如Popover或者部分弹出窗口。模态视图通常包括完成和取消按钮。
模态视图设计要点：
-
尽量减少使用。通常来说，用户喜欢用非线性方式与应用程序交互。当某些任务必须要完成、保存某些数据或者放弃的时候才能继续使用app的时候，你可以考虑设计一个模态视图来吸引用户的注意力。
-
提供一个明显且安全的方式来退出模态视图。确保用户退出模态视图的时候，他们能很清楚的知道自己下一步的结果。
-
确保模态视图任务简单、快速、集中注意力。不要使用模态视图在你的app中再造一个app，如果一个模态视图任务太复杂，人们在进入模态视图的时候就会丢失刚才之前进行的任务。对于创建涉及到试图层次结构的模态任务，要特别小心，因为用户很可能会忘了刚才自己在干嘛。如果一个模态任务必须包含子视图，则提供一个通过层次结构展现的单一路径和一个清晰的完成路径。不要随便使用完成按钮，除非模态任务结束了。
-
显示指定任务的标题，如果合适的话。你还可以在视图的其他部分提供更全面描述任务或指导的文本。
-
为一些关键或紧急的信息保留Alerts模式。一个Alert会打断用户流程，并且需要用户多一次点击去忽略提醒。所以一定要让用户觉得这个打断是重要且必要的。
-
尊重用户的通知设置。用户会在应用程序设置中配置来自你的应用程序的通知。你需要尊重用户的设置，不要把用户逼到去关闭系统通知。
-
不要在Popover上显示模态视图。除了Alerts外，任何东西都不能出现在Popover中。在极少数的情况下，如果你需要在Popover中触发行为后显示模态视图，你应该在模态视图显示之前关闭Popover。
-
模态视图的样式要和你的主应用和谐一致。比如，如果你的模态视图还包含导航栏，你最好保持和主应用程序相同的导航栏视觉设计。
-
选择一个合适的模态视图样式。比如下面这几种。
-
全屏。覆盖整个屏幕，可以在模态视图中完成复杂的任务。
-
Page Sheet。在大屏设备上，可以覆盖大面积的底层内容。所有没被覆盖的区域都会被调暗，免得用户发生误交互。如果是在小屏设备上，那就是覆盖全屏了，而且是纵向覆盖。用于在模态视图中完成复杂任务。
-
Form Sheet。对于大屏设备，显示在屏幕中心，如果键盘处于激活状态，可以重新定位。所有没激活的区域将调暗，免得用户发生误交互。在小屏设备上，那就是覆盖全屏。主要用于收集信息。
-
当前环境。与它的父视图相同大小。仅用于大屏设备的分屏视图、Popover或其它非全屏视图中。
-
选择适当的过度样式。使用与App和谐一致的动画切换风格，增强用户对临时环境转换的感知。默认的切换动画是垂直从屏幕底部至上切入，并在退出模态视图后原图切回。翻转式动画切换一般用于横屏切换。从视觉上看，模态视图看起来像当前视图的反面。一旦结束就会切回来。在整个App中呈现一致的动画切换风格。
三、导航
导航的设计应该是自然且“隐于无形”，除非用户觉得不符合他们的使用预期，否则他们是不会在意导航是怎么设计的。PM的工作就是需要设计一套合理的导航系统，用以支撑你的App的架构以及产品目标，而且要符合用户的使用习惯。导航应该让用户觉得自然且亲切，而且不能喧宾夺主。在iOS中，有三种导航样式，在我们这次提到的两种“切页方式”中，除了模态视图的“纵向切页”外，剩下的横向切页就是其中一种树形导航结构，又叫阶层式导航。
