欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

flutter color Api 使用

程序员文章站 2024-03-18 13:01:16
...

flutter中得16进制颜色

在flutter中,如果使用#ffffff这样得16进制设置字体颜色,是不能直接设置得。使用方法如下:

使用 #ffffff 这种16进制颜色

使用方法:

color: ColorUtils.hexToColor('#ffffff')

工具函数封装:

// colorUtils.dart
import 'package:flutter/material.dart';

class ColorUtils {
  static Color hexToColor(String s) {
    // 如果传入的十六进制颜色值不符合要求,返回默认值
    if (s == null || s.length != 7 || int.tryParse(s.substring(1, 7), radix: 16) == null) {
      s = '#999999';
    }
    return new Color(int.parse(s.substring(1, 7), radix: 16) + 0xFF000000);
  }
}

使用 rgba(55, 1, 200, 0.5) 这种RGB颜色

  • 在css中,这样得颜色设置:

rgba (Red(红色)Green(绿色)Blue(蓝色)和 Alpha 透明度
color : rgba(55, 1, 200, 0.5)

  • 在flutter中,这样得颜色设置

rgba (Red(红色)Green(绿色)Blue(蓝色)和 Opacity 透明度
color: Color.fromRGBO(55, 1, 200, 1)


flutter使用示例:

 FlatButton(
   color: Color.fromRGBO(55, 1, 200, 1),
   child: Text('flatbutton'),
   onPressed: () {
     print('flatbutton');
   },
 ),

fromARGB()

flutter 还有一种使用RGB颜色得方法: color.fromARGB().
这种把透明度写在了最前面,建议建议使用上面两种书写方法,与前端css保持一致.

// a是alpha值,0是透明的,255是完全不透明的。
// R是红色的,从0到255。
// G是绿色的,从0到255。
// B是蓝色的,从0到255。

const Color.fromARGB(
	int a,
	int r,
	int g,
	int b
)

参考资料

fromRGBO 函数源码
fromARGB 函数源码