Flutter 的字体与排版

排版涵盖了字体或字体的样式和外观：它指定了字体的粗细、倾斜度、字母间距以及文本的其他视觉方面。

并非所有字体都生而相同。

字体样式至少由以下几个方面定义：一个字体系列，代表同一字体家族中（例如 Roboto 或 Noto）字体的通用字符规则集；一个字重（例如，常规、粗体或一个数值）；以及一个样式（例如，常规、斜体等）。所有这些以及额外的预设属性共同构成了我们所说的静态字体。

可变字体允许在运行时修改其中一些属性，并将通常是多个静态字体存储在单个文件中。

排版字号体系是一组相关的文本样式，旨在为您的应用提供平衡、连贯性和视觉多样性。

Flutter 中常见的字号体系，由 TextTheme 提供，包括五类文本，指示其功能：

• 显示
• 标题
• 标题
• 标签
• 正文

每种类型还有三种大小变体：

• 小
• 中
• 大

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

Flutter 提供的所有平台特定排版字号体系都包含在 Typography 类中。通常，您无需直接引用此类，因为 TextTheme 会根据您的目标平台进行本地化。

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

Google Fonts 上越来越多的字体提供了一些可变字体功能。您可以使用字体测试器查看选项范围，并了解如何变化单个字体。

实时移动任意轴上的滑块，查看它如何影响字体。在编程可变字体时，使用 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 风格（取决于应用运行的平台）、动画以及自定义片段着色器结合在一起

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