Flutter 的字体与排版

排版 (Typography) 涵盖了字体或字形的样式与外观：它定义了字体的粗细、倾斜度、字符间距以及文本的其他视觉方面。

并非所有字体都是生而平等的。

字体样式至少由以下要素定义：字体族 (Typeface)，代表描述同一字体家族（例如 Roboto 或 Noto）中通用字符规则的集合；字重 (Font weight)（例如 Regular、Bold 或数值）；以及样式（例如 Regular、Italic 等）。所有这些以及其他预设属性共同构成了我们所说的静态字体。

可变字体允许在运行时修改其中一些属性，并将原本需要多个静态字体文件才能实现的效果存储在一个文件中。

排版比例是一套相关的文本样式，旨在为您的应用提供平衡、连贯性和视觉多样性。

Flutter 中由 TextTheme 提供的通用排版比例，包含五种用于标识功能的文本类别：

• 显示 (Display)
• 标题 (Headline)
• 小标题 (Title)
• 标签 (Label)
• 正文 (Body)

此外，每种类别还有三种大小变化：

• 小 (Small)
• 中 (Medium)
• 大 (Large)

这十五种类别与文本大小的组合，每一项都由一个 TextStyle 表示。

Flutter 公开的所有平台特定排版比例都包含在 Typography 类中。通常情况下，您无需直接引用该类，因为 TextTheme 会根据您的目标平台自动本地化。

可变字体允许您控制文本样式的预定义方面。可变字体支持特定的轴，例如宽度、字重、倾斜度等。用户在指定字体类型时，可以从连续轴中选择任何值。

Google Fonts 上有越来越多的字体提供可变字体功能。您可以通过使用“字体测试器 (Type Tester)”来查看可选范围，并了解如何对单个字体进行变体设计。

通过实时拖动任意轴上的滑块，观察它如何影响字体。在编写可变字体代码时，请使用 FontVariation 类来修改字体的设计轴。FontVariation 类符合 OpenType 字体变量规范。

Google Fonts 也包含静态字体。与可变字体一样，您需要了解字体的设计方式，才能知道可以使用哪些选项。同样，Google Fonts 网站可以为您提供帮助。

虽然您可以从网站下载字体并手动安装到应用中，但您也可以选择直接使用 pub.dev 上的 google_fonts 软件包。

它们可以直接通过引用字体名称来使用：

Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(),
),

或者通过设置生成的 TextStyle 的属性来进行自定义：

Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(
    textStyle: Theme.of(context).textTheme.displayLarge,
    fontSize: 48,
    fontWeight: FontWeight.w700,
    fontStyle: FontStyle.italic,
  ),
),

使用以下 API 以编程方式更改静态字体（但请记住，这仅在字体被设计为支持该功能时才有效）：

• FontFeature 用于选择字形
• FontWeight 用于修改字重
• FontStyle 用于设置斜体
• FontVariation 用于为特定属性指定一系列值。

FontFeature 对应于 OpenType 特性标签，可以被看作是一个用于启用或禁用给定字体功能的布尔标志。

下面的视频展示了 Flutter 排版的一些功能，并结合了 Material 和 Cupertino 的外观与感觉（取决于应用运行的平台）、动画以及自定义片元着色器 (fragment shaders)。

在 YouTube 新标签页中观看：“使用 Flutter 进行精美设计原型制作 (Prototyping beautiful designs with Flutter)”

要阅读一位工程师自定义可变字体并为其添加变形动画的经验（这也是上述视频的基础），请查看 Medium 上的免费文章：Flutter 中的趣味排版 (Playful typography with Flutter)。相关的示例也使用了自定义着色器。