如何为整个Flutter应用全局设置Font Features（字体特性）

我的设计师要求应用内所有文本启用Font Features，目前我知道可以通过TextStyle的fontFeatures参数为单个Text组件设置该特性，示例代码如下：

Text(
  'Some text',
  style: TextStyle(
    fontFeatures: [
      FontFeature.stylisticSet(2),
      FontFeature.stylisticSet(3),
      FontFeature.stylisticSet(4),
    ],
  ),
);

但不清楚如何为项目中所有Text组件统一配置该特性，求解决方案。

解决方案1：通过ThemeData全局配置 #

Flutter的ThemeData允许你定义全局文本样式，你可以在textTheme中为所有预设文本样式统一添加fontFeatures：

MaterialApp(
  theme: ThemeData(
    textTheme: TextTheme(
      // 覆盖所有常用文本样式，添加统一的fontFeatures
      bodyLarge: TextStyle(fontFeatures: [
        FontFeature.stylisticSet(2),
        FontFeature.stylisticSet(3),
        FontFeature.stylisticSet(4),
      ]),
      bodyMedium: TextStyle(fontFeatures: [
        FontFeature.stylisticSet(2),
        FontFeature.stylisticSet(3),
        FontFeature.stylisticSet(4),
      ]),
      bodySmall: TextStyle(fontFeatures: [
        FontFeature.stylisticSet(2),
        FontFeature.stylisticSet(3),
        FontFeature.stylisticSet(4),
      ]),
      headlineLarge: TextStyle(fontFeatures: [
        FontFeature.stylisticSet(2),
        FontFeature.stylisticSet(3),
        FontFeature.stylisticSet(4),
      ]),
      // 其他如titleLarge、labelSmall等样式按需添加
    ),
    // 若使用primaryTextTheme等其他主题文本样式，需对应配置
  ),
  home: const YourHomePage(),
);

这种方法无需修改现有Text组件引用，只要所有Text继承全局主题样式即可生效。

解决方案2：封装自定义Text组件 #

如果允许替换项目中所有Text组件的使用，可以封装一个内置统一fontFeatures的自定义组件，同时支持传入自定义样式覆盖：

class CustomText extends StatelessWidget {
  final String data;
  final TextStyle? style;
  final TextAlign? textAlign;
  final int? maxLines;
  final TextOverflow? overflow;

  const CustomText(
    this.data, {
    super.key,
    this.style,
    this.textAlign,
    this.maxLines,
    this.overflow,
  });

  @override
  Widget build(BuildContext context) {
    // 合并传入样式与全局fontFeatures，传入样式优先级更高
    final mergedStyle = style?.copyWith(
          fontFeatures: [
            ...?style?.fontFeatures, // 保留传入的fontFeatures
            FontFeature.stylisticSet(2),
            FontFeature.stylisticSet(3),
            FontFeature.stylisticSet(4),
          ],
        ) ??
        TextStyle(
          fontFeatures: [
            FontFeature.stylisticSet(2),
            FontFeature.stylisticSet(3),
            FontFeature.stylisticSet(4),
          ],
        );

    return Text(
      data,
      style: mergedStyle,
      textAlign: textAlign,
      maxLines: maxLines,
      overflow: overflow,
    );
  }
}

之后项目中所有文本展示都用CustomText替代原生Text，后续调整字体特性只需修改这一个组件即可，灵活性更强。

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