如何将自定义Color转换为MaterialColor用作ThemeData的primarySwatch？

可以直接转换，primarySwatch要求的MaterialColor是一种包含10种不同明度色值的色集，基于你给出的主色手动生成对应色集即可正常使用。

具体实现代码 #

首先定义主色并生成MaterialColor实例：

// 定义#9b210c对应的Color实例
const Color customPrimary = Color(0xFF9B210C);

// 生成MaterialColor
MaterialColor customPrimarySwatch = MaterialColor(
  customPrimary.value,
  <int, Color>{
    50: customPrimary.withOpacity(0.1),
    100: customPrimary.withOpacity(0.2),
    200: customPrimary.withOpacity(0.3),
    300: customPrimary.withOpacity(0.4),
    400: customPrimary.withOpacity(0.5),
    500: customPrimary.withOpacity(0.6),
    600: customPrimary.withOpacity(0.7),
    700: customPrimary.withOpacity(0.8),
    800: customPrimary.withOpacity(0.9),
    900: customPrimary,
  },
);

之后直接将生成的customPrimarySwatch传入ThemeData的primarySwatch参数即可：

ThemeData(
  primarySwatch: customPrimarySwatch,
  // 其余主题配置项
)

可选优化（Material 3项目） #

如果你的项目启用了Material 3规范，可以不需要手动转换MaterialColor，直接通过colorSchemeSeed参数传入自定义Color即可，框架会自动生成完整的配色体系：

ThemeData(
  useMaterial3: true,
  colorSchemeSeed: customPrimary,
)

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