在Flutter中使用16进制颜色

在Flutter中使用16进制颜色banner.png

使用16进制表示颜色是较为主流的方式, 那么在本篇文章中将简单讲讲如何在Flutter中使用16进制颜色.

方法一: 使用原生方法

Flutter中, Color类仅接收整数作为参数. 你也可以使用fromARGB或者fromRGBO.

比如拿到了一个16进制颜色#b74093. 因为Color还需要传入透明度, 255就是最大值(也就是不透明), 转为16进制就是0xFF, 所以我们只需这样表示:

const color = Color(0xffb74093);

正规一点的写法(可选, 因为大小写不敏感):

const color = Color(0xFFB74093);

方法二: 接收字符串格式, 转为Color

创建一个HexColor类:

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

  HexColor(final String hexColor) : super(_getColorFromHex(hexColor));
}

然后进行调用:

Color color1 = HexColor("b74093");
Color color2 = HexColor("#b74093");
Color color3 = HexColor("#88b74093");

感谢

• How do I use hexadecimal color strings in Flutter? - Stack Overflow
• Pexels 上的 icon0.com 拍摄的照片

结语

如果你对本篇文章有任何问题, 欢迎在下方评论区, 进行讨论, 或加入阿航的技术小站QQ交流群

原文链接

欢迎访问阿航的技术小站官网, 获取更多技术干货!