Flutter如何动态将字符串颜色值赋值给Colors类的color属性

Dart 是静态类型语言，原生不支持Colors.动态属性名这类反射写法，你可以通过以下两种常见方案实现需求： #

方案1：修改列表存储类型，直接存Color对象（最推荐，性能最优） #

直接把原来的字符串列表调整为存储 Flutter 原生 Color 类型值，后续直接调用即可：

// 替换原有字符串列表，直接存Color对象，无需额外转换开销
List<Color> arrColorList = [Colors.blue, Colors.red, Colors.yellow];

// 赋值时直接取对应下标值即可
color: arrColorList[index]

方案2：若必须保留字符串类型的颜色列表，新增映射表做转换 #

如果业务场景要求必须存储颜色字符串（比如颜色值是后端返回的字符串字段），可以新增一层字符串到Color的映射关系：

// 先定义字符串和Color的映射规则
Map<String, Color> colorMap = {
  'blue': Colors.blue,
  'red': Colors.red,
  'yellow': Colors.yellow,
};
List<String> arrColorList = ['blue', 'red', 'yellow'];

// 赋值时通过映射表取值
color: colorMap[arrColorList[index]]!

修改后的完整代码示例 #

List<String> arrColorList = ['blue', 'red', 'yellow'];
// 新增颜色映射表
Map<String, Color> colorMap = {
  'blue': Colors.blue,
  'red': Colors.red,
  'yellow': Colors.yellow,
};

return Scaffold(
  backgroundColor: Colors.white,
  body: Container(
    child: Center(
      child: Container(
        child: Center(
          child: SingleChildScrollView(
            child: Container(
              child: Padding(
                padding: const EdgeInsets.all(36.0),
                child: ListView.builder(
                  scrollDirection: Axis.vertical,
                  shrinkWrap: true,
                  itemCount: arrColorList.length,
                  itemBuilder: (BuildContext context, int index) {
                    return GestureDetector(
                      onTap: () {},
                      child: SizedBox(
                        width: 42.0,
                        height: 42.0,
                        child: DecoratedBox(
                          decoration: BoxDecoration(
                            // 替换为映射表取值即可
                            color: colorMap[arrColorList[index]]!,
                          ),
                        ),
                      ),
                    );
                  }),
              ),
            ),
          ),
        ),
      ),
    ),
  )
);

注意：如果存在颜色字符串不在映射表中的场景，建议增加默认值兜底，例如color: colorMap[arrColorList[index]] ?? Colors.grey，避免空值报错。

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