一、SF Symbols 是什么？

SF Symbols 是一组符号图标，在 WWDC 2019 期间推出，大概有 1500 个之多。它们在 app 中可以按照各种 weights and scales 进行对齐和配置，以适应我们的设计。 由于它们已集成到 San Francisco 系统字体中，因此它们会自动确保与所有 weights and sizes 的文本垂直对齐。

适用平台：

• iOS 13 and later
• macOS 11 and later
• watchOS 6 and later
• tvOS 13 and later

WWDC 2020 又引入了 SF Symbols 2.0，增加了多个类别的超过750个新符号，如 devices, health, transportation symbols 等等。改善了水平对齐、引入了彩色图标、支持了适应系统书写方向的本地化、增加了一系列限制符号。苹果还提供了一个查看 SF Symbols 的客户端软件。该软件可以查看、copy、导出可使用的 symbols。

二、今年的 SF Symbols 3 更新了什么？

1、符号变体

默认的轮廓型 .outline ，在其基础上的填充型 .fill。以及根据这两种类型变异而来的更丰富的斜线型变体 .slash , 封闭型变体（.circle, square, .rectangle）

符号变体

• 轮廓 - 在没有上下文的情况下默认
• 填充 - 例如在标签栏中的默认值
• 斜线 - 传达删除或显示项目为非活动或不可用的功能
• 封闭变体 - 包含在圆形、正方形或矩形等形状内的符号

合理使用符号变体：

1. 滑动操作和 iOS 标签栏中的填充符号提供一致的外观和强调程度，在使用强调色定义时更好地控制指示选择的区域。
2. 带有填充变体的圆圈内的符号在小尺寸时提供更好的易读性。
3. 符号的轮廓或默认变体非常适合 UI 中的工具栏、导航栏、列表和其他地方，这些地方的符号与文本一起显示或符号需要显示统一的外观。

2、新符号

SF Symbols 3 新增了近 600 个涉及多个方面的新符号，包括有：

• Apple 新产品（AirPods、homePods 等）
• 视频游戏控制器符号
• 健康相关的
• 有助于界面布局和窗口管理相关的
• watchOS

3、本土化

所有本地化的符号和脚本变体都会根据用户的设备语言（包括从右到左的书写系统）自动适应。扩大了 SF Symbols 脚本覆盖范围，为阿拉伯语、希伯来语和梵文提供了新的符号、还有包括泰语、中文、日语和韩语的新变体。

4、符号剖析

符号层次结构

• 每个符号都是由一个或多个封闭的向量路径（图层）绘制而成，路径的绘制方式不是用笔画（strokes）而是用轮廓（outlines）
• 通过注释等级可以快速识别符号结构的主要、次要甚至第三层级
• 某些符号具有所有（三个）层次级别

• 符号的第一个和第二个元素之间不接触或有间隙的形状被认为是次要的

  
  
  次要层级

• 相互接触并封装在内部的形状成为第三层级

  
  
  第三层级

5、渲染模式

一共四种渲染模式，两种新模式：分成（Hierarchical）和调色板（Palette），以及之前的多色（Multicolor） 和单色（ Monochrome）。

渲染模式

分层渲染模式（新）

• 使用具有不同的不透明度的单一颜色，为符号添加视觉层次。
• 创造深度和重点，同时允许单一色调推动整体美感。
• 当具有共同形状的多个符号并排呈现时，这种渲染模式会强调它们之间的差异，旨在使符号更清晰易辨。

• 通过调节不透明度来减少多余的视觉噪音，而无需删除符号的基本元素。

  
  
  分层渲染模式

调色板渲染模式（新）

• 可以为每个层次级别定义一种颜色和不透明度，颜色和不透明度都可以独立控制

• 如果三层符号只应用了两种颜色，则第三层将使用与第二层相同的样式

  
  
  分层vs调色板

多色渲染模式

• 表示符号的内在或原生颜色的渲染模式
• 许多符号具有这种内在的调色板，这是默认情况下呈现的
• 自定义时，可以任意分配每种颜色。
• 多色渲染模式下的一个符号可以是：
  完全着色
  部分着色，这意味着符号的一部分将具有多色功能，而另一部分将依赖于强调色
  如果不包含任何多色信息，将以单色呈现

单色渲染模式

• 最统一和一致的渲染模式
• 颜色和不透明度在整个符号中一致应用，没有层次结构