Flutter Material3如何让浅色/深色主题共享基础主题？

问题出在你直接用copyWith修改brightness——你的base主题默认是基于浅色亮度生成的颜色方案，改brightness属性只会切换标记，不会重新生成适配深色的完整色彩系统，所以深色主题会沿用浅色的颜色。

正确的做法是把非颜色的共享配置（字体、按钮样式等）抽离，分别为深浅主题生成符合Material3的色彩方案，再合并共享配置：

修改后的代码实现 #

// 抽离共享的非颜色配置：字体、按钮样式等
final TextTheme _sharedTextTheme = const TextTheme(
  bodySmall: TextStyle(),
  bodyMedium: TextStyle(),
  bodyLarge: TextStyle(),
  titleSmall: TextStyle(),
  titleMedium: TextStyle(),
  titleLarge: TextStyle(
    fontSize: 20,
    fontWeight: FontWeight.bold,
  ),
).apply();

final ElevatedButtonThemeData _sharedElevatedButtonTheme = ElevatedButtonThemeData(
  style: ElevatedButton.styleFrom(
    textStyle: const TextStyle(fontSize: 15),
    padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 30),
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
  ),
);

final TextButtonThemeData _sharedTextButtonTheme = TextButtonThemeData(
  style: TextButton.styleFrom(
    padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 30),
  ),
);

final OutlinedButtonThemeData _sharedOutlinedButtonTheme = OutlinedButtonThemeData(
  style: OutlinedButton.styleFrom(
    padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 30),
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
  ),
);

// 生成浅色主题
final lightTheme = ThemeData.from(
  colorScheme: ColorScheme.fromSeed(
    seedColor: const Color(0xFF2C6C2F),
    brightness: Brightness.light,
    useMaterial3: true,
  ),
  useMaterial3: true,
).copyWith(
  textTheme: _sharedTextTheme,
  elevatedButtonTheme: _sharedElevatedButtonTheme,
  textButtonTheme: _sharedTextButtonTheme,
  outlinedButtonTheme: _sharedOutlinedButtonTheme,
);

// 生成深色主题
final darkTheme = ThemeData.from(
  colorScheme: ColorScheme.fromSeed(
    seedColor: const Color(0xFF2C6C2F),
    brightness: Brightness.dark,
    useMaterial3: true,
  ),
  useMaterial3: true,
).copyWith(
  textTheme: _sharedTextTheme,
  elevatedButtonTheme: _sharedElevatedButtonTheme,
  textButtonTheme: _sharedTextButtonTheme,
  outlinedButtonTheme: _sharedOutlinedButtonTheme,
);

关键说明 #

1. 抽离共享配置：把字体、按钮样式这些和颜色无关的配置单独定义，避免重复代码
2. 基于ColorScheme生成主题：用ColorScheme.fromSeed分别生成适配深浅亮度的色彩系统，完全遵循Material3的色彩规范
3. 合并配置：通过ThemeData.from创建基础主题后，用copyWith把共享配置合并进去，保证深浅主题的非颜色样式统一

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