如何在Flutter应用中全局禁用字体缩放（替代废弃textScaleFactor）

针对你需要全局固定字体缩放、避免系统字体设置破坏布局的需求，可以使用Flutter 3.10+推出的TextScaler API替代已废弃的textScaleFactor，实现全局禁用字体缩放的效果，无需逐个处理Text组件。

核心实现代码 #

直接在MaterialApp的builder中重写全局的MediaQueryData，将textScaler设置为TextScaler.noScaling()：

MaterialApp(
  builder: (context, child) {
    final mediaQuery = MediaQuery.of(context);
    // 替换全局文本缩放器为无缩放模式
    final updatedMediaQuery = mediaQuery.copyWith(
      textScaler: TextScaler.noScaling(),
    );
    return MediaQuery(data: updatedMediaQuery, child: child!);
  },
  // 其他配置项
  home: const YourHomePage(),
);

方案说明 #

• TextScaler.noScaling()是Flutter官方提供的预设缩放器，它会强制所有文本的缩放比例为1.0，完全忽略系统的字体缩放设置，从根源上避免字体变大导致的布局错乱。
• 这个方案是全局生效的，所有依赖MediaQuery获取文本缩放的组件（包括Text、AppBar、Button等自带文本的组件）都会自动应用无缩放规则，不需要像临时方案那样逐个设置字体大小。

例外场景处理 #

如果某些页面或组件需要保留系统字体缩放，可以在对应层级重新覆盖MediaQuery的textScaler：

// 在需要启用系统缩放的页面中
Widget build(BuildContext context) {
  final originalMediaQuery = MediaQuery.of(context);
  return MediaQuery(
    data: originalMediaQuery.copyWith(
      textScaler: TextScaler.linear(originalMediaQuery.textScaleFactor),
    ),
    child: Scaffold(
      appBar: AppBar(title: const Text("保留系统缩放的页面")),
      body: const Text("这段文本会跟随系统字体缩放"),
    ),
  );
}

对比旧废弃方案 #

之前基于textScaleFactor的全局方案已经被标记为废弃，而使用TextScaler的方案是官方推荐的替代方式，兼容性更好，也符合Flutter的API演进方向。

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