zt：【详解】为什么苹果iOS是最好的手机系统，这些细节安卓粉了解吗？上篇

本帖并不想吹苹果 iOS 相比安卓有多好，而是使用 iOS 为例子，谈一谈对于手机系统而言，何谓流畅。为了直观的展示 iOS 的动画效果，本帖使用了不少动图，加载需要时间，我在这儿提前感谢各位读者的耐心等待🙏。 近几年来，随着国内手机品牌如华为、小米日渐成熟，开发者们设计系统不再一味追求功能强大，而开始在审美、交互以及过渡动画上下功夫。得"益"于厂商们大力度地营销，就算是不太关心数码的吃瓜网友，对"非线性动画" "高刷新率"等名词也有所耳闻；

何谓流畅？这个概念就和"全面屏"一样，我们可以感性地将"全面屏"定义为"好像手里握着一块玻璃"，但很难给予一个量化的描述。我说苹果 iOS 比华为 EMUI 流畅，如果单单是"凭感觉"，那评论区免不了用户们各执一词的互喷，而厂商也无法从批评中学到任何东西。 本帖参考了WWDC2018 的相关演讲，试图从三个维度衡量手机系统的流畅度： 1. 动画设计：同为非线性，同为 60 帧，为什么动画的观感有差异？ 2. 交互方式：全面屏时代，手势操作和 Home 键 / 三大金刚键有何区别？ 3. 符合直觉：过分华丽的动画使人眼花，如何兼顾观感和用户体验？
Part One.⎡动画设计：拟物，可不止图标⎦ 我们知道，在手机屏幕里飞来飞去的 App，并不是真的在手机里运动，而是手机系统在短时间内展示多张不同的图像，让观者产生"它在运动"的错觉。连续播放的静止画面 + 肉眼的视觉残像，"动画"就产生了。 ▼ 动图，翻书动画

在固定时间内，一段动画展示的静止画面越多，它造成的肉眼错觉就越强，对观者而言就越流畅。我们把 1 秒内播放的画面数量称为"帧率"，主流显示器的 60 帧，即指"1 秒内展示 60 个画面"来构成动画效果。那么两段帧率相同的动画，它们带给观者的流畅感是相同的吗？请看下面的例子。 ▼ 动图，两个以不同速度运动的小球

尽管两个小球的帧率相同，速度较慢的小球，其轨迹与动效都十分细腻；而速度较快的小球，则在运动时产生了割裂感，好像是一顿一顿地前进。这是为什么？当我们记录下小球经过的各个位置，背后的原因就显现了。

速度快的小球，两帧之间的变化太大，球的残像甚至不重叠，对眼睛而言就像跳跃一样；而速度慢的小球，两帧之间的变化较小，对眼睛而言更加舒适。 手机动画自然没有小球来回运动这么简单，但想让动画流畅，原理是不变的：帧与帧之间的变化不能太大，否则同样的帧率，你的动画就会变卡。以主屏幕打开 App 的缩放动画为例，各位觉得哪个更流畅？ ▼ 动图，两种 IT 之家的打开动画

• 第一种动画将 App 窗口变形成桌面图标的大小，然后展开成完整的 App 窗口； • 第二种动画维持 App 窗口的原始比例，逐渐从小窗变成大窗。 动画一虽华丽但卡顿，动画二虽普通但流畅，理由同上：直接从图标大小展开成完整窗口，每帧之间的变化太大，有割裂感。从系统设计的角度出发，显然动画一是符合需求的（许多安卓 OS 用的就是它），毕竟 App 图标是正方形且面积小，手机屏幕是长方形且面积大，画面变形、大小剧变似乎是不可避免的问题。我们看看苹果 iOS 是如何处理该动画的：

第一步，App 的图标会变形成与 iPhone 屏幕长宽比相近的长方形。

值得注意的是，图标的变形并不是简单的拉伸，而是给原图标添加"下巴"以调整长宽比。若是直接把图标拉成长方形，则会变得很丑。 ▼ 某 UI 简单粗暴地图标拉伸

▼ 苹果 iOS 会给非纯色的图标加入匹配的"下巴"

第二步，因为 App 图标已经变形，App 界面能以原始长宽比逐渐显示在图标之上。

▼ 当 App 窗口完全显示时，其面积已经充斥 1/4 屏幕了，因此之后的缩放不会因为变化率太大而产生割裂感。为了让 App 窗口尽量大些，苹果还用一个遮罩隐藏了部分内容，使得窗口实际大小比看到的还大。

第三步，App 窗口完全填充手机屏幕。除了 App 内容在慢慢放大外，遮挡窗口的遮罩也在不断拉长，逐渐显示出完整的 App。一切，都是为了让帧与帧间的变化不至于太大，最后造就细腻的动画。

仅是如此，iOS 的动画只能算"精致"，还算不上"流畅"。我们来回顾下"非线性动画"的概念。这里使用高中物理课常用的"位置 — 时间"图象，即 x-t 图，来直观展示线性的"线"究竟指什么：

• 1 号是一条逐渐趋于水平的曲线，代表物体做减速运动，到达终点时速度刚好为零； • 2 号是一条折线，代表物体先做匀速直线运动，到达终点时速度突然归零。 我们称第 1 种运动是"非线性"的，因为它在"位置 — 时间"图中并非直线，而是连续变化的曲线。祸害无数学子的数学家莱布尼茨说过（虽然是错误的🙅‍♂️）：  大自然没有跳跃。
Nature Does Not Make Jumps. 显然，线性运动在现实情况下不可能实现，折线的弯折处实际上还是曲线，因为速度减到 0，无论如何是一个渐变的过程。但在代码构成的电子设备中，线性运动是可以实现的，而且在安卓 OS 的动画中广泛存在。打开一个 App，图标以匀速直线运动放大，然后运动突然停止，十分生硬。 问题是，只要是曲线，我们都称为"非线性"运动，但曲线的类型是无穷无尽的，合适的曲线造就完美的动画，怪异的曲线还不如直线。

苹果是如何设计非线性动画的曲线的？iOS 从拟物发迹，之后经历了扁平化的洗礼，似乎与拟物渐行渐远。但是，iOS 的动画却从未离开过现实中的物体，所有动画曲线都使用了"弹簧"这一物理模型作为参照，通过"弹力"让手机系统变得流畅。

• 弹簧的运动端是将要运动的物体； • 弹簧的固定端是物体运动的终点； • 整个弹簧系统处在水平面上； 通过调节弹簧的松紧程度、物体的质量以及系统中的阻力，我们能得到无数种运动曲线，但每一种都不违和：因为它们都遵守着同一条物理法则（胡克定律），且完全符合人类在现实生活中培养起来的物理直觉。 ▼ 设置阻力为极大，物体运动到终点即停止，不会来回弹；

▼ 设置阻力为极小，物体到达终点后会过冲，并处在震荡之中；

这些个"弹簧"具体对应了苹果 iOS 的哪些动画呢？（大量动图预警⚠️） 首先是主屏幕与系统： ▼ 轻轻返回主屏幕

▼ 用力返回主屏幕

▼ 系统中几乎所有可交互的元素都有弹性

得益于苹果严苛而统一的设计语言，"弹簧"动画也充斥着第三方 App。所有 iOS 的列表都自带弹力，很直观的反映了"列表已到头"的讯息：
用心的开发者也会调用 iOS 的动画 API，打磨 App 的细节： ▼ 轻轻下拉菜单

▼ 用力下拉菜单
讲到这儿，我相信各位对"流畅"有了更深的理解。帧率越高，系统就越流畅？并不，这要看你在每一帧画面中填充了什么内容；动画越花，系统就越流畅？并不，这取决于你的运动轨迹是如何设计的。苹果 iOS 的动画看似复杂，其实仅仅遵循着现实生活中最简单的原理：弹性。通过胡克定律，iOS 将各种动效整合在一起，既融入了系统，也融入了第三方 App 开发的准则中，使用户体验连贯一致。这正应了苹果首席设计师乔纳森的那句话：
真正的简约绝不是删繁就简，而是在纷繁中建立秩序。 True simplicity is derived from so much more than just the absence of clutter and ornamentation. It’s about bringing order to complexity. 链接​

这么真实？一个评论都没有,果然是讲事实就哑火了。

LZ好多图动不了？

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

因为我属实看不太懂🐶，我就知道iPhone丝滑

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

emmm，我在等课代表总结

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

图都不动，看不懂

好文帮顶

苹果的美学一直都是在线的，从乔布斯时代一直传承下来。 不过也有一些小功能不如安卓便利，希望在两家竞争下，为消费者带来更好的体验

臣妾真的做不到。

分析没毛病 就是图裂了

引用 @沈小科科科科 发表的:
LZ好多图动不了？

对，动图动不了，看到一半就没兴趣了。直接拉下来看评论，果然没有几条

谁能解释下第一张图画这么多圈是想表达什么？

对我来说苹果安卓的区别在于使用寿命

楼主你有好多图不动

说一千道一万，设计理念各不同

这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

这是从it之家拷贝过来的吧

细节 李姐

好帖，可这区更喜欢撕逼...好无语的。

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

顶起来

很多APP他没有，所以我选安卓

404 not found

这贴没人看

快拉倒吧，多开几个后台应用切换下试试

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

科普干货贴还是要多一点好。苹果的动画是有专利的，世界第一，独孤求败，不是针对谁的水平

看你这真的还不如看MIUI12的发布会

好帖子

卧槽， 原来 用力回退 跟轻轻回退动画是真不一样的……

用一加8pro对比苹果11试试

真能吹

真的，作为一个开发觉得，想写出好的动画真的很难了，线性代数一定得学好。

差距其实更大的是软件优化，如果安卓也跟苹果一样封闭，软件权限更严格，估计不用现在这样堆参数也能很流畅

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

这篇文章有什么问题吗。

好文，不过放数码区等于问道于盲。

这才是数码区该有的帖子！

引用 @MITEE 发表的:
这篇文章有什么问题吗。

汪精卫卖国求荣，你却还说他丢钱给乞丐是仁慈？

引用 @笨笨的婧婧 发表的:
汪精卫卖国求荣，你却还说他丢钱给乞丐是仁慈？

这篇文章有什么问题吗？

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

人家这篇文章没半点毛病为什么不能点赞？

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

看了下记录，不是吹印度问题了，感觉是真的来上班的。

引用 @带篮孑 发表的:
这篇文章有什么问题吗？

这楼主前两天刚吹英国特效药打爆中国，然后吹了印度医药打爆中国，我也不知道他有什么问题

引用 @科詹一家亲呀 发表的:
人家这篇文章没半点毛病为什么不能点赞？

这楼主前两天刚吹英国特效药打爆中国，然后吹了印度医药打爆中国，我也不知道他有什么问题

引用 @带篮孑 发表的:
这篇文章有什么问题吗？

这篇文章闭口不谈XR开应用还没mate20Pro快，却拼命从无法量化的所谓“流畅性”上入手。 对大多数用户来说很简单，谁开应用快谁就流畅，整那么多花里胡哨的干啥。

引用 @MITEE 发表的:
这篇文章有什么问题吗。

没啥问题，都是转的自然没问题，但是看他回帖记录都是一个套路，立马在底下回复个，讲事实没人回复？讲事实没人讨论？感觉不太正常……

引用 @沈小科科科科 发表的:
LZ好多图动不了？

https://quan.ithome.com/0/655/094.htm it之家的，建议想看数码的去it之家吧，不撕逼的专业论坛

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

这贴有什么不对？你是酸苹果的吧

楼主解释一下，外国那么好怎么不移民呢？去印度不难吧？ 还有要点赞楼主的，麻烦解释一下

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

论迹不论心🐶

引用 @JYPG 发表的:
这贴有什么不对？你是酸苹果的吧

印度人，你没移民吗？

提示一下，这人上班的

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

看了他帖子记录，给我整笑了。

引用 @JYPG 发表的:
https://quan.ithome.com/0/655/094.htm it之家的，建议想看数码的去it之家吧，不撕逼的专业论坛

转载经过原作者同意了吗

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

如果是印吹 请有多远滚多远

这个logo不是最强大脑的一个题吗🐶

引用 @MITEE 发表的:
这篇文章有什么问题吗。

现在数码区好多人都是先政审再回帖，标题内容都不看先看人家发帖回帖记录然后就站队

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

没毛病，解决不了他发的帖子，就解决他

引用 @左光斗 发表的:
这篇文章闭口不谈XR开应用还没mate20Pro快，却拼命从无法量化的所谓“流畅性”上入手。 对大多数用户来说很简单，谁开应用快谁就流畅，整那么多花里胡哨的干啥。

想反，大多数人不掐表看应用打开时间，反而会觉得xr比m20p流畅，不就证明了动画的重要性？

那个微信拉伸的是哪个UI？

我以为你在讲底层呢，搞半天在这讲动画。

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

我看了楼主的记录，真是只要跟中国沾边，无论是啥，都是辣鸡啊，外国的就香的不行

老哥您好，这边恁看可以在IT之家发表一下这篇文章吗

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

请问有原文链接吗？好多图打开不了啊

引用 @左光斗 发表的:
这篇文章闭口不谈XR开应用还没mate20Pro快，却拼命从无法量化的所谓“流畅性”上入手。 对大多数用户来说很简单，谁开应用快谁就流畅，整那么多花里胡哨的干啥。

打开流畅，中途不用了？

引用 @消防栓和除草机 发表的:
现在数码区好多人都是先政审再回帖，标题内容都不看先看人家发帖回帖记录然后就站队

一个个都老政审了

引用 @JYPG 发表的:
这么真实？一个评论都没有,果然是讲事实就哑火了。

是不屑于理你，吹苹果吹魔怔了，感动了自己？？

引用 @消防栓和除草机 发表的:
现在数码区好多人都是先政审再回帖，标题内容都不看先看人家发帖回帖记录然后就站队

所以⛵你怎么看？

引用 @笨笨的婧婧 发表的:
汪精卫卖国求荣，你却还说他丢钱给乞丐是仁慈？

建议你不要在这贴评论了，有点无理取闹。请勿撕逼

引用 @xys2014xys 发表的:
没啥问题，都是转的自然没问题，但是看他回帖记录都是一个套路，立马在底下回复个，讲事实没人回复？讲事实没人讨论？感觉不太正常……

领工资发帖的🐶，它的同类在虎扑还有好几个！

引用 @消防栓和除草机 发表的:
现在数码区好多人都是先政审再回帖，标题内容都不看先看人家发帖回帖记录然后就站队

政审笑尿。。

除了ipad pro连高刷屏都没有，在这说流畅，呵呵

楼主能不能爬出来打字

引用 @津岛小善子 发表的:
想反，大多数人不掐表看应用打开时间，反而会觉得xr比m20p流畅，不就证明了动画的重要性？

哪里的大部分人觉得xr快？果蛀群吗。。

引用 @JYPG 发表的:
建议你不要在这贴评论了，有点无理取闹。请勿撕逼

建议你不要污染数码区，印吹能死挺吗？

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

转的文章有什么问题吗？海狗子反驳不了就这点本事吗

好文章！！！

好贴，可惜有些图加载不出来

引用 @笨笨的婧婧 发表的:
这楼主前两天刚吹英国特效药打爆中国，然后吹了印度医药打爆中国，我也不知道他有什么问题

真·答非所问

引用 @jr们的父亲 发表的:
真·答非所问

我爱中国，不舔印度，谢谢

引用内容被灭过多已被折叠

别人问这篇文章有什么问题，你扯楼主上一贴的印度，我有点没看明白

引用 @jr们的父亲 发表的:
别人问这篇文章有什么问题，你扯楼主上一贴的印度，我有点没看明白

我说这个楼主前两天刚刚舔印度黑中国，再往前舔英国黑中国，结果转个贴就有人舔了，我也有点没看明白

引用内容被灭过多已被折叠

中国不需要2b去爱，谢谢

引用 @记性太好 发表的:
中国不需要2b去爱，谢谢

中国更不需要2b来住，谢谢

引用 @津岛小善子 发表的:
想反，大多数人不掐表看应用打开时间，反而会觉得xr比m20p流畅，不就证明了动画的重要性？

两台放一起就能对比出来了，实际上两台都很快，不卡。 我没觉得mate20Pro快的那一刹那有多重要，同样也没觉得XR的动画有多重要。

引用 @津岛小善子 发表的:
想反，大多数人不掐表看应用打开时间，反而会觉得xr比m20p流畅，不就证明了动画的重要性？

不是流畅，是不掉帧。m20p多任务切换掉帧时不时出现，而xr没有。 这不是流畅能定义的，这应该是过渡自然。而且如果你说的不掐表，那反而看不出掉帧。 区里所谓的0.3秒掉帧就不是肉眼能看出来的。

引用 @笨笨的婧婧 发表的:
我说这个楼主前两天刚刚舔印度黑中国，再往前舔英国黑中国，结果转个贴就有人舔了，我也有点没看明白

舔了么？人家说的是这篇文章有问题吗？有么？有没？

引用 @一场黄粱梦 发表的:
不是流畅，是不掉帧。m20p多任务切换掉帧时不时出现，而xr没有。 这不是流畅能定义的，这应该是过渡自然。而且如果你说的不掐表，那反而看不出掉帧。 区里所谓的0.3秒掉帧就不是肉眼能看出来的。

手持m20p表示并没有掉帧，谢谢

引用 @笨笨的婧婧 发表的:
这楼主前两天刚吹英国特效药打爆中国，然后吹了印度医药打爆中国，我也不知道他有什么问题

对事不对人，这篇文章挺有干货的

引用 @科詹一家亲呀 发表的:
人家这篇文章没半点毛病为什么不能点赞？

有各种毛病只是你看不出来，人是收钱的专业果吹

引用 @Commyz 发表的:
对事不对人，这篇文章挺有干货的

那得看是什么人，谢谢。吹苹果可以说是爱好问题，舔印度舔英国防疫黑中国，那就是立场问题。

引用 @xys2014xys 发表的:
看了下记录，不是吹印度问题了，感觉是真的来上班的。

这是it之家的帖子，之前看到过，单说这个帖子的话说的没啥问题，不过这楼主发帖记录实在是。。。。

引用 @沈小科科科科 发表的:
LZ好多图动不了？

点最后链接原文里可以看到

引用 @笨笨的婧婧 发表的:
这楼主居然还有点赞的？说一下这楼主前不久刚刚吹了印度，被步行街各种鄙视，数码区还真tm有人捧臭脚

不以言举人，不以人废言。 没人教过你吧。

引用 @笨笨的婧婧 发表的:
汪精卫卖国求荣，你却还说他丢钱给乞丐是仁慈？

只是转贴罢了，以这楼主水平绝对写不出这种帖

引用 @消防栓和除草机 发表的:
现在数码区好多人都是先政审再回帖，标题内容都不看先看人家发帖回帖记录然后就站队

先政审再回帖哈哈哈你这个说法太形象了

引用 @梧桐树枝繁叶茂 发表的:
只是转贴罢了，以这楼主水平绝对写不出这种帖

对啊，转贴博个果粉点赞，下一篇继续去黑中国，美滋滋滴

再给MIUI5年，吊打IOS

引用 @笨笨的婧婧 发表的:
楼主解释一下，外国那么好怎么不移民呢？去印度不难吧？ 还有要点赞楼主的，麻烦解释一下

对你这种白吃需要解释吗？

引用 @笨笨的婧婧 发表的:
我说这个楼主前两天刚刚舔印度黑中国，再往前舔英国黑中国，结果转个贴就有人舔了，我也有点没看明白

对事不对人，这个文章有什么问题？

引用 @亚里克斯卡鲁索 发表的:
转载经过原作者同意了吗

这畜生哪懂这些