最近手机一直提醒我软件更新，听升级完的同事说，“先别升级，目前很多bug，我们自己的产品在13系统上部分界面细节不兼容。”

WWDC大会上设计师也讲述了这次的变化，全是英文很多童鞋看不完就关掉了。那么我通过看的文章以及自己使用体验给大家简单归纳一下。

全局组件：

1.1默认头像图标

以前的默认头像是一男一女的剪影组成。在其他位置，比如：通讯录详情页、短信列表、AppStore所用的默认头像均为“男性”剪影。

而在iOS 13中，上述这些位置的头像，都变成了去性别特征的圆形头像。如下图：

Apple没有根据账号性别显示男/女头像，而是采用“无性别头像”。我想这么做也许是为了更好的照顾到“跨性别群体”的感受。此前跨性别群体曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等标志，这些眼下已出现在iOS 12.2的Emoji中。

毕竟我们的苹果CEO库克，就是一位和蔼的好同志～

1.2开关

自iOS 7发布以来，iOS的切换开关一直没有变化。其特点是，开关的投影延展到了“凹槽”外、且底色会有缩放动效。这里非常不友好的是：当设计师在切图时，容易将阴影范围包含进去，给前端造成了困扰。因为看着设计稿的尺寸边距永远跟切图不能完全吻合，还容易将阴影切出一条生硬的边线。

本次苹果对切换开关的细节做了调整，在最新的iOS 13中，开关的投影缩到了“凹槽”内，并且取消了底色缩放的过渡，改用“渐隐渐显”的过渡方式。

1.3图标

一些长期保留直角的图标，在iOS 13中均改为圆角，线条也得到了加粗。

Apple今年在Mac上推出了一款名为 SF Symbols 的软件。里面集成了约1500个官方图标，这些图标分别具有9种重量（粗细），可以与San Francisco字体无缝结合。设计师可以根据文字的字重，选配对应重量（粗细）的图标，如下图：

使用教程请参见： https://developer.apple.com/videos/play/wwdc2019/206/

1.4分段控件

新版的分段控件由过去的描边线，改为填充的形式。其中，选中状态的滑块含投影，投影效果和切换开关一样，投影只在“凹槽”内。

现在越来越多的App弃用描边按钮，改用面型按钮。在iOS 11苹果重做AppStore时，就将“安装/更新”的线性按钮改为填充，如下图：

不知未来是不是一个趋势，设计师可以考虑尝试将自己的产品优化了。

1.5弹窗视图

本次交互比较大的修改之一就是弹窗视图的变化：操作的视图会被縮小，同時淡化置于新跳出视图的下方。

这样的弹窗视图在Human Interface Guideline（苹果设计指南）中被称为Sheet。新版的视图有助于用户明确信息的层级，便于用户找回此前被暂停的任务。

新版的视图弹窗（Sheet）提供三种关闭方式：

    ◆ 从屏幕顶部向下滑动

    ◆ 当卡片内容滚动到顶部时，从屏幕上的任何位置向下滑动 （单手操作的）

    ◆ 点击取消按钮

如果关闭新版弹窗时存在“修改为储存的内容”这类行为时，要提醒使用者是否要放弃编辑。以日历App为例：

iOS 12新建任务退出没有提醒，而在iOS 13中进行相同的操作，就会出现对应的提醒。

根据苹果在HIG中的建议，弹窗中的任务需要简单、简短，避免过于复杂，导致用户忘了此前他们所暂停的任务，进而导致用户“迷路”，以通讯录为例：

新建联系人可能会填写大量信息，适合采用全屏视窗，而添加照片、添加动话表情则非常适合使用新版弹窗。

1.6 HapticTouch

在iOS 13中，Apple取消了 3DTouch（又名 Force Touch），改用了HapticTouch，即：长按。

此前，在支持3DTouch的机型上，轻轻长按桌面图标，图标会开始晃动，会进入重新排列桌面的状态。而“重按”某个图标，就可以通过3DTouch呼出菜单。

在改用HapticTouch之后，原本的3DTouch也随之取消，系统不再区分轻按和重按。只能通过长按呼出菜单，“重新排列桌面”也变成了菜单中的一个选项。如下图：

除了手机桌面，其他支持3DTouch的操作，也纷纷变成了HapticTouch，比如原本Safari可以通过3DTouch呼出预览，大家可不要按错了，囧

1.7  Context Menu

其实，Context Menu某种程度上可以看做是电脑上的鼠标“右键”操作。用户可以通过快速弹窗的菜单在页面中进行更多操作。

与电脑鼠标“右键”不同的是，Context Menu还携带了一个内容的预览画面。

在过去，这样的操作需要配合“3DTouch+上滑”才可以调起底部的互动，如下图

而Context Menu则是通过长按一步调起预览画面和菜单。

1.8 音量调整视图

还有本次变化之大的地方就是：音量建的显示，终于！！不显示在视线最中央了！！！

iOS13的音量控制图标也进行了全新的设计，音量大小的图标被设计在了屏幕左侧。在音量调节过程中，喇叭图标也非常直观的显示了音量大小的变化。

另外，左侧的音量可以支持滑动调整，类似底部控制器弹窗的音量调节。

1.9 三指菜单

过去，在iPhone上编辑内容时，如果删除了不该删除的内容，可以通过摇一摇手机，执行撤销操作，如果想“取消刚执行的撤销”，需要再次摇一摇手机，选择“重新正在键入”。讲真，这套操作理解起来还真有点麻烦。

对此，在iOS 13中也有优化，只要用3个手指点击屏幕，就可以呼出一个全新的菜单。用来完成：撤销、剪切、复制、粘贴、重做这五个操作。

拷贝：三指捏合，可以快速拷贝；

剪切：连续三指捏合两次，即可剪切；

粘贴：三指外扩，即可粘贴；

撤销：三指向左轻扫，即可轻松撤销；

重做：三指向右轻扫，即可重做；

请牢记，以后会用得到～

2.0无痕模式

因以前系统在开启无痕模式后，导航变为深色系，那么出现暗黑风格之后，如何变化的呢？

本期先介绍到组件吧，下一期开始给大家搬app中的一些变化～期待吧