探索旧金山字体


旧金山字体家族

旧金山不是一个单一的字体，它称为SF Pro，SF Compact等，并且每个字体都有文本，显示和舍入版本。似乎"显示"比"文本"具有更大的权重是因为"文本"是一种强调可见性的字体，因此不应使用较细的字体。

SF Pro与SF Compact

SF Pro用作macOS，iOS和tvOS设备的系统字体。 SF Compact已被用作Apple Watch的系统字体。紧凑型笔记本电脑具有正方形的形状，旨在在Apple Watch等小型设备上轻松可见。

显示与文字

小写字母应易于阅读，大写字母应绘制精美。由于这些天有各种尺寸的显示器，因此字体问题因环境而异。因此，SF Pro和SF Compact分别有两个版本，分别为Display和Text。
从2018年左右开始，还添加了圆形字体Rounded。

调整了

文本的间距和粗细，以便于即使很小的字符也易于阅读，但是如果将其用作标题等，它们将变得引人注目并破坏美观。因此，系统字体自动在使用文本显示小文本和显示文本显示大文本之间切换。显示大于20pt的文本，小于20pt的文本，依此类推。
如果您在macOS / iOS本机应用程序中使用系统字体，这是一个自动过程，但是设计人员需要在屏幕设计(例如Sketch)领域中意识到这一点。

  • SF Pro Display –用于20pt以上的大文本。如果缩小并按原样显示，字符将被卡住并且难以阅读。

  • SF Pro文本–适用于小于20pt的小文本。它比Display更具可读性，但是如果您放大它，它的外观不是很漂亮。

  • 系统字体– macOS和iOS用户界面中使用的字体。 "系统字体"不是特定的字体，而是包含多种字体的元字体。元字体会根据情况自动切换实际字体。实际字体通常用.AppleSystemUIFont等表示，但是不能保证此名称是固定值，因此不应直接指定。

SF Pro与SF UI

曾经被称为

SF UI的字体突然被称为SF Pro，我想知道，" SF UI到哪里去了？"我不确定细节，但似乎旧金山字体已进行了较小的更新，自2017年6月WWDC(macOS High Sierra / iOS 11)起，SF UI已被SF Pro取代。因此，现在SF UI被视为较旧的版本。当我检查Font Book.app中的信息时，2015年SF UI的版权为版本12系列，而2015-2017年SF Pro的版权为版本13系列，因此将来SF让我们使用Pro。

https://developer.apple.com/ios/human-interface-guidelines/visual-design/typography/

在iOS 10中，旧金山的变体为SF UI文本和SF UI显示。

SF Pro也有望在将来进行更新，因此，在WWDC之后，可以在Apple的旧金山字体页面上获得最新的SF Pro字体是一个好主意。

(您可以在GitHub上找到很多San Francisco，但可能是有人自己上传的，因此请务必从官方网站https://developer.apple.com/fonts/上获取它) 。)

作为参考，连续SF的版本表如下所示。我不会一直检查它，并且会尽我所能列出它，因此很可能会遗漏。

<表格>

字体名称

版本

备注


<身体>

SF Pro显示器

15.0d5e5; 2019-07-10

2019年7月版

SF Pro Text

15.0d5e5; 2019-07-10

2019年7月版

SF Pro四舍五入

15.0d5e5; 2019-07-10

2019年7月版

SF Pro显示器

13.0d1e33; 2017-05-30

2017年版本

SF Pro Text

13.0d3e20; 2017-05-30

2017年版本

SF UI显示

12.0d6e2; 2016-12-21

我可以确认的最终版本。最高iOS 10

SF UI文本

12.0d6e2; 2016-12-21

我可以确认的最终版本。最高iOS 10

SF UI显示

11.0d45e1--BETA； 2015-05-21

2015 Beta

SF UI文本

11.0d45e1--BETA； 2015-05-21

2015 Beta

SF Compact Display

15.0d5e5; 2019-07-10

2019年7月版

SF紧凑文本

15.0d6e5; 2019-07-10

2019年7月版

SF Compact四舍五入

15.0d5e5; 2019-07-10

2019年7月版

SF Compact Display

12.0d8e1; 2016-12-21

2016年12月版

SF紧凑文本

12.0d8e1; 2016-12-21

2016年12月版

SF Mono

15.0d4e71; 2019-06-25

2019年6月版

SF Mono

13.1d0e1; 2017-05-04

2017年5月版本(Xcode /终端捆绑版)


SF Mono

最初是Xcode和Terminal中使用的等距SF，它于2019年8月作为字体文件向公众发布。它基于SF字体，但经过专门设计以提高代码的可读性。

src=

在Xcode和Terminal中，它们位于以下目录中。

1
Xcode.app/Contents/SharedFrameworks/DVTKit.framework/Versions/A/Resources/Fonts/
1
Terminal.app/Contents/Resources/Fonts/

SF Pro JP

苹果网络和资料中使用的日语字体。在网站上知道它是一种名为SF Pro JP的网络字体。当前，它尚未作为字体文件公开提供。看起来就像AXIS。

重量

权重的类型如下。在Cocoa中定义为NSFont.Weight，在Cocoa Touch中定义为UIFont.Weight。

  • 超轻
  • 瘦
  • 光
  • 常规的
  • 中等的
  • 半粗体
  • 大胆的
  • 重的
  • 黑色(极厚)

但是，对于SF Pro Text，如上面Family Tree的图像所示，它仅限于以下内容。

  • 光
  • 常规的
  • 中等的
  • 半粗体
  • 大胆的
  • 重的

要使用

权重获得系统字体，请执行以下操作：

苹果系统

1
let font = NSFont.systemFont(ofSize: 20, weight: NSFont.Weight.light)

的iOS

1
let font = UIFont.systemFont(ofSize: 20, weight: UIFont.Weight.light)

要从

NSFont或UIFont对象获取体重信息，请将其转换为CTFont，然后提取该信息。 CTFont，NSFont和UIFont具有免费的桥接关系，因此像这样进行投射非常容易。

苹果系统

1
2
3
4
5
6
let ctFont = font as CTFont
let traits = CTFontCopyTraits(ctFont) as Dictionary // CFDictionary もまた Dictionary にキャストできる
if let weightNum = traits[kCTFontWeightTrait] as? NSNumber {
    let weight = NSFont.Weight.init(CGFloat(weightNum.doubleValue))
  ...
}

追踪

如果将"系统字体"和SF Pro Display / SF Pro Text对齐，则会发现它们的字符间距不同。系统字体具有自己的类似"字距调整"的字符间距调整，称为"跟踪"。跟踪值是根据点大小单独定义的，并且跟踪表也由Apple提供。

iOS HIG具有SF跟踪表。跟踪表因SF版本而异，因此请始终参考最新版本。

人机界面指南-版式
https://developer.apple.com/ios/human-interface-guidelines/visual-design/typography/

曾经对应到San Francisco字体页面的链接的跟踪对应表(iOS)