【译】Visual Studio Insider 来了！

谆衬百钨什么是Character？什么是Glyph？Character和Glyph是否一一对应？我们常说的Font又包含哪些东西？如果要自己实现一套文本的分词、测量和布局，又需要理清楚哪些概念？ascent、descent、lineHeight之间的关系是怎么样的？

本文将尽量以简洁易懂的方式来解释以上问题，也可以提前Mark起来，作为日后的速查手册。

二、Character

Character也叫字符，是一个抽象概念，比如字母A、中文你等都可以视为一个字符，它只是一个语义单位，不关心具体长什么样。

三、Glpyh

Glpyh也叫字形，表示字符的绘制方式；一个字符可以有多种方式绘制，比如字母A，可以有不同的大小、粗细、斜体、衬线等，但都是同一个字符；这些不同的绘制方式，都叫字形。

在这里插入图片描述

3.1 Character与Glyph的关系

字符与字形并非一一对应关系，一个字符可以由多个字形表示，比如é可以是e和重音符号′的组合，在一些连字情况下，一个字形也可以代表多个字符，如下：

在这里插入图片描述

四、Font

4.1 Typeface

指一套具有统一设计风格的Font集合，它是一种设计概念，而不是具体的文件

4.2 Font

Font可以理解成Typeface的某个具体实现。

以Helvetica为例：

Typeface：Helvetica

Font：

Helvetica Regular.ttf

Helvetica Bold.ttf

Helvetica Italic.ttf

Helvetica Bold Italic.ttf

4.3 Font Family

Font Family是一组属于同一个Typeface的字体（Fonts），它们共享设计风格，只是字重/宽度/样式不同。

比如：Helvetica是一个Font Family，里面包含字体：

Helvetica Regular

Helvetica Bold

Helvetica Italic

Helvetica Bold Italic

4.4 Font Descriptor

Font Descriptor（字体描述符）是一种属性集合（Font Family、Font Weight、样式 (italic/oblique)、大小等），用来描述或查询一个字体；它不是字体文件，而是一个“过滤条件”或“配置对象”，在 CoreText 里对应 CTFontDescriptor。

Font Descriptor可以用于匹配系统中符合条件的字体，也可以用它来派生一个具体的CTFont，如：

// 这里的 descriptor 只是描述条件，真正的字体对象是 font

let descriptor = CTFontDescriptorCreateWithAttributes([

kCTFontFamilyNameAttribute: "Microsoft YaHei",

kCTFontWeightTrait: 0.8

])

let font = CTFontCreateWithFontDescriptor(descriptor, 14, nil)

4.5 Font Collections

Font Collections是一组字体的集合，通常用于检索和筛选，在 CoreText 里对应CTFontCollection。

它可以包含系统中所有可用字体，也可以按条件过滤出子集，主要用途有：

枚举系统安装的字体

根据 Font Descriptor 找到所有匹配的字体

做字体选择器 UI（比如 Word 里的字体下拉框）

4.6 小结

在这里插入图片描述

4.7 Glyph与Font的关系

简单理解，Font里存储了Glyph的绘制样式，Glyph与Unicode的映射关系等。

Font里有各种各样的表，存储了Unicode code point与GlyphID的映射关系，每个Glyph绘制时的advance width 和left side bearing等，后续会有单独的文章详细解析Font文件内容，这里先理解二者的概念。

五、文字排版的基本概念

基本概念 解释

metrics 由字体设计师提供，用于描述每个Glyph周围的间距

advance width 前进宽度，基线方向到下一个Glyph origin的距离，或者理解为字形绘制完后，光标应该前进多少距离

left-side bearing Glyph origin与Glyph左侧的间距

right-side bearing Glyph右侧与advance width终点的距离

ascent Glyph origin到Font中最高Glyph的顶部距离

descent Glyph origin到Font中最低Glyph的底部距离

bounding box

bounding rectangle 包含Glyph可视区域（注意非advance width）最小rect

kerning 通常，Glyph一般按advance width排列，但为了提高可读性，通常会引入kerning来扩大或缩小两个glyph之间的间距，比如W和A：

在这里插入图片描述

leading/linegap line之间的添加的距离

lineHeight lineHeight = ascent + descent + leading