SF Symbols详细介绍（一） —— 简介（一）

版本记录

版本号	时间
V1.0	2021.05.21 星期五

前言

SF Symbols 在 WWDC 2019 期间推出。自此Apple 为我们提供了免费 Symbols，供我们在应用中使用，而且使用它们非常简单。 不久前，WWDC 2020 又引入了 SF Symbols 2.0，这让我们在 app 中使用精美的图标更加容易。

开始

SF Symbols 在 WWDC 2019 期间推出。自此Apple 为我们提供了免费 Symbols，供我们在应用中使用，而且使用它们非常简单。 不久前，WWDC 2020 又引入了 SF Symbols 2.0，这让我们在 app 中使用精美的图标更加容易。

SF Symbols提供了一组超过2,400个一致的，高度可配置的符号，您可以在应用程序中使用它们。 Apple设计了SF Symbols来与San Francisco系统字体无缝集成，因此这些符号会自动确保与所有权重和大小的文本保持垂直的光学对齐。

您可以使用SF symbols来表示各种UI元素中的任务和内容类型，例如导航栏，工具栏，选项卡栏，上下文菜单和小部件。 在应用程序的其余部分中，可以在任何可以使用图像的位置使用符号。 SF符号在iOS 13和更高版本，macOS 11和更高版本，watchOS 6和更高版本以及tvOS 13和更高版本中可用。

各个符号和功能的可用性取决于您所定位的系统版本。当您将SF Symbols 2中引入的符号导出为SVG模板并将其与您的应用bundle在一起时，您可以在以iOS 13，Mac Catalyst 13，tvOS 13或watchOS 6为target的应用中使用它，但没有SF Symbol功能的好处有2种，例如多色支持和自动本地化。访问SF Symbols下载该应用程序并浏览完整的符号集。

SF Symbols 2引入了750多个新符号，其中包括：

• 超过150种预配置的多色符号，可自动适应鲜艳度，辅助功能设置和外观模式
• 标准符号和自定义符号中的负边距，使您可以更好地控制水平对齐方式
• 从右到左书写系统的本地化符号变体，以及阿拉伯语，梵文和希伯来语的特定于脚本的符号

重要：所有SF符号应被视为Xcode和Apple SDK许可协议license agreements中定义的系统提供的图像，并应遵守其中规定的条款和条件。您不得在应用程序图标，徽标或任何其他与商标相关的用途中使用SF符号（或实质上或令人困惑的字形）。 Apple保留进行审查的权利，并有权单方面决定要求对违反上述限制的任何Symbol进行修改或中止使用，并且您同意立即遵守任何此类要求。

---

A Closer Look at SF Symbols

SF Symbols具有广泛的weights and scales，可帮助您创建适应性强的设计。

九个符号的权重（从超轻到黑色）分别与San Francisco系统字体的权重相对应。这种对应关系使您可以在符号和相邻文本之间实现精确的权重匹配，同时支持针对不同大小和上下文的灵活性。

每个符号也有三种比例：小，中（默认）和大。比例是相对于San Francisco系统字体的大写字母高度定义的。通过指定比例，可以调整符号相对于相邻文本的权重，而不会破坏与使用相同磅值的文本的权重匹配。有关开发人员的指导，请参阅imageScale (SwiftUI), SymbolScale (UIKit), and SymbolConfiguration (AppKit)。

默认情况下，符号可以使用应用的强调色(accent color)。在SF Symbols 2和更高版本中，可以使用多色符号来显示包含多种颜色的图像。例如，cloud.sun.rain.fill符号使用白色表示云，使用黄色表示太阳，使用蓝色表示雨。在某些情况下，可以在符号的不同区域中使用不同的颜色。例如，您可能希望为folder.badge.plus的文件夹区域指定一种颜色，例如应用程序的accent color，而系统会为badge提供绿色。有关开发人员的指导，请参见renderingMode(_:)。

默认情况下，多色符号会自动适应不同的外观模式，例如Dark Mode。如果在创建的自定义符号中指定颜色，则自定义符号不会自动适应不同的外观模式。

---

Creating Custom Symbols

如果需要SF Symbols未提供的符号，则可以创建自己的符号。 SF Symbols应用程序使您可以将可重复使用的基于矢量的文件格式的符号导出为模板。要创建自定义符号，请导出与所需设计相似的SF符号，然后使用矢量编辑工具（如Sketch或Illustrator）修改模板。与使用原始模板文件一样，在您的应用程序中使用结果。 （自定义符号不支持自适应颜色。）有关开发人员的指导，请参阅Creating Custom Symbol Images for Your App。有关无法自定义的符号列表，请参见Symbols for Use As-Is。

Be guided by the template。创建一个自定义符号，该符号在详细程度，optical weight，对齐方式，位置和视角方面与系统提供的符号保持一致。努力设计一个符号，它是：

• Simple
• Recognizable
• Not offensive
• Directly related to the action or content it represents

要支持各种文本设置，请根据您的应用程序所需的weights and scales创建自定义符号。要启用粗体文本设置并支持动态类型，请在所有scales下以regular, medium, semibold, and bold创建符号。如果您的应用使用了其他字体weights and scales，请同样在这些weights and scales中创建符号。

如有必要，请使用负侧边距来辅助光学水平对齐。 SF Symbols 2为包含徽章或其他增加符号宽度的元素的符号提供负边距。例如，在水平对齐一堆文件夹符号（其中一些包含徽章）时，可能需要使用负边距。在少数情况下，多个具有负边距的符号并排出现，您可能需要在它们之间添加空格或其他内容，以避免发生冲突。

请勿使用Apple产品的副本。 Apple产品受版权保护，不能在您的自定义符号中复制。

提供自定义符号的替代文本标签。替代文字标签（或辅助功能说明）不可见，但它们使VoiceOver能够以听觉方式描述屏幕上的内容，从而使视障人士更容易导航。

---

Symbols for Use As-Is

某些符号无法导出为模板进行自定义，并且只能用于参考下面记录的Apple技术，表格如下。

参考资料

1. SF Symbols 简介
2. 官网

后记

本篇主要讲述了SF Symbols简介，感兴趣的给个赞或者关注~~~