Flutter颜色(Color)使用和十六进制颜色转换

17 min read

Flutter中颜色的设置有很多方法，但是一般我使用的有4种，由于平时开发中十六进制色值使用的比较多，所以最后对十六进制色值的使用进行了封装

常规用法

1、Color c1 = Color(0xFF3CAAFA);
2、Color c2 = Color.fromRGBO(60, 170, 250, 1);
3、Color c3 = Color.fromARGB(255, 60, 170, 250);
4、Color c5 = Colors.blue;
  • 1、Color(int value)
    Color(0xFF3CAAFA),value接收的是一个十六进制（0x开头),FF表示的是十六进制透明度(00-FF),3CAAFA是十六进制色值。
  • 2、Color.fromRGBO(int r, int g, int b, double opacity)
    *Color.fromRGBO(60, 170, 250, 1)*，r、g、b分别表示red、green、blue，常规的红绿蓝三色，取值范围为0-255，opacity表示透明度，取值0.0-1.0。
  • 3、Color.fromARGB(int a, int r, int g, int b)
    *Color.fromARGB(255, 60, 170, 250)*,a表示透明度，取值0-255，rgb同上一样。
  • 4、Colors._()
    Colors类定义了很多颜色，可以直接使用，例如 Colors.blue,其实就是第一种***Color(int value)***的封装。

十六进制使用封装

我们使用十六进制颜色的时候透明度使用的比较少，但是系统的方法总是带上透明度用着很不舒服，这里所以对十六进制用法做了一层封装处理，代码如下

class ColorsUtil {
   /// 十六进制颜色，
   /// hex, 十六进制值，例如：0xffffff,
   /// alpha, 透明度 [0.0,1.0]
   static Color hexColor(int hex,{double alpha = 1}){
    if (alpha < 0){
      alpha = 0;
    }else if (alpha > 1){
      alpha = 1;
    }
    return Color.fromRGBO((hex & 0xFF0000) >> 16 ,
         (hex & 0x00FF00) >> 8,
         (hex & 0x0000FF) >> 0,
         alpha);
   }
}

使用的时候直接引入，调用即可

ColorsUtil.hexColor(0x3caafa)//透明度为1
ColorsUtil.hexColor(0x3caafa,alpha: 0.5)//透明度为0.5