Flutter Material 3：如何通过Theme Data应用排版？数字参数含义与实现

一、数字含义 #

截图里的两个数字是Material 3排版系统的核心参数：

• 第一个数字：字体大小（Font Size），单位为dp（Flutter中对应逻辑像素），决定文字的显示尺寸。
• 第二个数字：行高（Line Height），控制文本行之间的垂直间距，是Material 3为不同文本层级（如正文、标题）预设的标准化值，用于保证视觉一致性与可读性。

二、Flutter ThemeData实现排版设置 #

通过ThemeData配合useMaterial3: true，可以轻松配置符合Material 3规范的排版：

1. 全局自定义文本样式 #

ThemeData(
  useMaterial3: true,
  textTheme: const TextTheme(
    // 以正文样式为例，对应截图的16（字体大小）和24（行高）
    bodyLarge: TextStyle(
      fontSize: 16,
      height: 1.5, // 行高与字体大小的比值（24/16=1.5）
      // 如需设置字间距，可添加letterSpacing参数，例：letterSpacing: 0.5
    ),
  ),
)

2. 基于Material 3官方排版修改 #

直接复用Material 3的基础排版体系，调整指定样式：

ThemeData(
  useMaterial3: true,
  typography: Typography.material2021().copyWith(
    bodyLarge: const TextStyle(
      fontSize: 16,
      height: 1.5,
    ),
  ),
)

3. 组件中引用主题样式 #

在具体Text组件里直接调用已配置的主题样式：

Text(
  "示例内容",
  style: Theme.of(context).textTheme.bodyLarge,
)

内容的提问来源于stack exchange，提问作者Mahmoud Saleh