如何在Flutter中使用十六进制颜色字符串并转换为Color对象？

我来给你详细讲讲在Flutter里怎么用十六进制颜色字符串吧，平时开发我也经常遇到这个需求，挺实用的技巧。首先得明确一点：Flutter里的Color对象本质是基于ARGB（Alpha透明度 + RGB颜色）的整数值，而我们常用的十六进制颜色比如#b74093只有RGB三个通道，所以直接用的话需要补全Alpha通道的信息。下面给你几种实用的处理方式：

1. 手动补全Alpha值直接转换 #

如果你的十六进制颜色是RGB格式（比如#b74093），可以在前面加上完全不透明的Alpha值FF，然后通过int.parse方法转成整数，再传入Color构造函数：

// 不带#的情况
Color myColor = Color(int.parse('FFb74093', radix: 16));
// 带#的情况，先去掉#再处理
Color myColor = Color(int.parse('FF' + 'b74093'.replaceAll('#', ''), radix: 16));

如果是带Alpha的十六进制（比如#80b74093，其中80代表半透明），直接去掉#转成整数就行：

Color semiTransparentColor = Color(int.parse('80b74093', radix: 16));

2. 封装工具方法/扩展函数（推荐） #

每次手动处理太麻烦，我一般会写个工具方法或者给String加个扩展，自动处理各种情况：

方法一：工具类 #

class HexColor {
  static Color fromHex(String hexString) {
    // 处理带#或不带#、RGB或ARGB的情况
    final buffer = StringBuffer();
    // 如果是6位或7位（带#）的RGB，默认补全完全不透明的Alpha值FF
    if (hexString.length == 6 || hexString.length == 7) buffer.write('FF');
    // 去掉#号
    buffer.write(hexString.replaceFirst('#', ''));
    return Color(int.parse(buffer.toString(), radix: 16));
  }
}

// 使用方式
Color myColor = HexColor.fromHex('#b74093');
Color anotherColor = HexColor.fromHex('b74093'); // 不带#也能直接用

方法二：String扩展（更简洁） #

extension HexString on String {
  Color toColor() {
    final buffer = StringBuffer();
    if (length == 6 || length == 7) buffer.write('FF');
    buffer.write(replaceFirst('#', ''));
    return Color(int.parse(buffer.toString(), radix: 16));
  }
}

// 使用方式超简洁
Color myColor = '#b74093'.toColor();
Color anotherColor = 'b74093'.toColor();

3. 直接在Widget中使用 #

转换后的Color对象可以直接用在任何需要颜色的地方，比如：

Container(
  color: '#b74093'.toColor(),
  padding: const EdgeInsets.all(16),
  child: const Text('Hello Flutter', style: TextStyle(color: Colors.white)),
);

小提示 #

• Alpha值的范围是00（完全透明）到FF（完全不透明），如果需要半透明的颜色，记得传入带Alpha的十六进制字符串，或者在工具方法里自定义默认Alpha值。
• 要是担心无效的十六进制字符串导致报错，可以在工具方法里加个异常处理，比如用try-catch包裹int.parse逻辑。

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