我如何转换一个十六进制的颜色字符串像#b74093在扑动的颜色?

我想在Dart中使用HEX颜色代码。


当前回答

你可以点击Color Widget,它会告诉你更深入的信息,这些字母代表什么。

你也可以使用Color.fromARGB()方法来创建自定义颜色,这对我来说更容易。使用Flutter Doctor颜色选择器网站为您的Flutter应用程序选择任何颜色。

其他回答

在Flutter中,Color类只接受整数作为参数,或者可以使用fromARGB和fromRGBO命名的构造函数。

因此,我们只需要将字符串#b74093转换为整数值。此外,我们需要尊重不透明度总是需要指定的。 255(完全)不透明度由十六进制值FF表示。这已经剩下0xFF了。现在,我们只需要像这样添加颜色字符串:

const color = const Color(0xffb74093); // Second `const` is optional in assignments.

字母可以选择大写或不大写:

const color = const Color(0xFFB74093);

如果你想使用百分比不透明度值,你可以用这个表中的值替换第一个FF(也适用于其他颜色通道)。

扩展类

从Dart 2.6.0开始,你可以为Color类创建一个扩展,它允许你使用十六进制的颜色字符串来创建一个Color对象:

extension HexColor on Color {
  /// String is in the format "aabbcc" or "ffaabbcc" with an optional leading "#".
  static Color fromHex(String hexString) {
    final buffer = StringBuffer();
    if (hexString.length == 6 || hexString.length == 7) buffer.write('ff');
    buffer.write(hexString.replaceFirst('#', ''));
    return Color(int.parse(buffer.toString(), radix: 16));
  }

  /// Prefixes a hash sign if [leadingHashSign] is set to `true` (default is `true`).
  String toHex({bool leadingHashSign = true}) => '${leadingHashSign ? '#' : ''}'
      '${alpha.toRadixString(16).padLeft(2, '0')}'
      '${red.toRadixString(16).padLeft(2, '0')}'
      '${green.toRadixString(16).padLeft(2, '0')}'
      '${blue.toRadixString(16).padLeft(2, '0')}';
}

fromHex方法也可以在mixin或类中声明,因为HexColor名称需要显式指定才能使用它,但是扩展对于可以隐式使用的toHex方法很有用。这里有一个例子:

void main() {
  final Color color = HexColor.fromHex('#aabbcc');

  print(color.toHex());
  print(const Color(0xffaabbcc).toHex());
}

使用十六进制字符串的缺点

这里的许多其他答案展示了如何从十六进制字符串动态创建Color,就像我上面所做的那样。然而,这样做意味着颜色不能是const。 理想情况下,您应该按照我在回答的第一部分中解释的方式分配颜色,这种方式在大量实例化颜色时更有效,Flutter小部件通常就是这种情况。

感谢提问,简单的解决方法如下:

//颜色为十六进制字符串

colorToHexString(Color color) {
  return '#FF${color.value.toRadixString(16).substring(2, 8)}';
}

//十六进制字符串到颜色

hexStringToColor(String hexColor) {
  hexColor = hexColor.toUpperCase().replaceAll("#", "");
  if (hexColor.length == 6) {
    hexColor = "FF" + hexColor;
  }
  return Color(int.parse(hexColor, radix: 16));
}

//如何调用函数

String hexCode = colorToHexString(Colors.green);
Color bgColor = hexStringToColor(hexCode);
print("$hexCode = $bgColor");

享受代码并帮助他人:)

这就是我的解决方案:

String hexString = "45a3df";
Color(int.parse("0xff${hexString}"));

这是唯一不需要额外步骤的方法。

最简单的方法是将其转换为整数。例如,#BCE6EB。你会添加0xFF,然后你会删除标签,使它:

0 xffbce6eb

然后让我们假设你要通过这样做来实现它:

写成backgroundColor:颜色(0 xffbce6eb)

如果你只能使用十六进制,那么我建议使用Hexcolor包。

供一般参考。有一种更简单的方法,使用supercharge图书馆。虽然您可以对所有提到的解决方案使用扩展方法,但您可以找到实用的用户库工具包。

"#ff00ff".toColor(); // Painless hex to color
"red".toColor(); // Supports all web color names

容易,对吧?

增压