作为一名前端，flutter里的颜色体系刚开始实在让人有些摸不着头脑，不能用rgb，十六进制的表达也和CSS中的不同，本文简单介绍了几种flutter中颜色的基本使用方法，让初学者能够快速上手，在flutter里自由变色🤪
flutter中各组件的颜色可以通过Colors Class和Color Class两种方法进行定义，也可进行各种图片混色，本文将对颜色的定义和图片混色模式进行介绍。
Colors class
Colors是包含在material.dart中的基础颜色类，直接用颜色名可以访问Colors类中的各种预设颜色，其中的颜色属性大多具备良好的语义信息，比如：
// 默认
Container(
color: Colors.pink,
)
// 颜色范围
Container(
color: Colors.pink[100],
)
默认的颜色已经在class中被定义好，直接使用即可，也可以配合颜色范围值的定义，大多数色板的颜色范围为 100 到 900，增量为 100，也可定义50。数字越小，颜色越浅，数字越大，颜色越深。
各类颜色定义可于官方文档查看Colors class 相比每个组件都独立配置颜色，官方更推荐通过themeData来保存和定义同一组件树上所有Widget的颜色配置，在更换主题颜色的时候尤其方便。
Color
对于想要自己定义想要的色值，而不依赖于官方的预设的情况（其实应该是大部分情况），可以通过Color的构造函数来生成颜色，示例代码如下：
// 默认
Container(
color: Color(0x3F267EF0),
)
其中需要传入的参数是标准十六进制的ARGB 表示法，每两位分别代表透明度（alpha）、红色(red)、绿色(green)、蓝色(blue)。
与在设计领域和CSS中常用的Hex（#开头的六位十六进制数）有所区别，如果在设计稿中获得颜色#F0F2F5，可通过简单的在前面添加透明度为255，也就是编码FF，来直接换算为Flutter中的ARGB表示，为Color(0xFFF0F2F5)。
但如果设计稿中的颜色为rgba，比如rgba(38, 126, 240, 0.25)，很多设计平台将其换算成Hex时，会只换算RGB的三个数值，如果仅仅将换算的Hex前面加上FF，透明度信息就会丢失，这里有两种解决办法：
- 第一种是手动换算透明度信息，比如透明度为0.25，我们就将255与0.25相乘得到64，也就是十进制表示为63，换算成十六进制就是3F，将其与rgb换算的hex组合得到ARGB表示，比如rgba(38, 126, 240, 0.25)换算为Color(0x3F267EF0)；
- 第二种则是通过各类网络平台进行自动换算（不推荐），准确率较低，大部分只提供rgb与Hex的相互换算。目前找到比较准确的平台：rgba to hex
图片颜色
flutter中图片Image组件能够使用color来混合颜色，不过需要注意⚠️的是，原始的png图片本身的透明度会影响混合后的结果，比如直接从figma等设计工具中保存颜色为rgba(10, 17, 26, 0.5)的png图片，其本身有50%的透明度，会导致混合的color也会带上50%的透明度，因此一般采用透明度为1的图片进行颜色混合来保证混合的准确性。
color属性用于定义混合的颜色，而colorBlendMode可以用来定义各种混合效果，我们以一个图像混合粉色来展示不同参数的具体混合效果。
Image(
image: AssetImage("assets/images/head.png"),
color: Colors.pink,
colorBlendMode: BlendMode.srcIn,
));
