Flutter颜色转换插件color_converter的使用

color_converter 是一个用于创建、转换和编辑颜色的Dart库。它可以在RGB、CMYK、HSB、HSL、XYZ、LAB等颜色空间之间进行转换。

安装

1. 在项目的 pubspec.yaml 文件中添加依赖：

   dependencies:
     color_converter: ^0.2.1
   

2. 使用IDE的GUI或者命令行来获取包：

   $ flutter pub get
   

使用方法

首先，需要导入 color_converter 匥：

import 'package:color_converter/color_converter.dart';

颜色空间

支持的颜色空间有：RGB, CMYK, HSB, HSL, LAB, 和 XYZ。它们分别用 [RGB], [CMYK], [HSB], [HSL], [LAB], [XYZ] 表示，并且都继承自 [BaseColor] 类。

创建颜色

可以通过构造函数或使用 fromHex 命名构造函数从十六进制字符串创建颜色对象。

示例代码

String hexColor = "#00ff00";

// 从十六进制字符串创建颜色
RGB rgbColor = RGB.fromHex(hexColor);
CMYK cmykColor = CMYK.fromHex(hexColor);
HSB hsbColor = HSB.fromHex(hexColor);
HSL hslColor = HSL.fromHex(hexColor);
LAB labColor = LAB.fromHex(hexColor);
XYZ xyzColor = XYZ.fromHex(hexColor);

print("RGB: $rgbColor");
print("CMYK: $cmykColor");
print("HSB: $hsbColor");
print("HSL: $hslColor");
print("LAB: $labColor");
print("XYZ: $xyzColor");

修改颜色

可以修改已创建的颜色对象的属性值。

示例代码

String hexColor = "#00ff00";
HSB hsbColor = HSB.fromHex(hexColor);

// 修改饱和度
hsbColor.s = 10;

print("Modified HSB Color: $hsbColor");

转换颜色

可以在不同颜色空间之间转换颜色。

示例代码

RGB rgbColor = RGB(r: 234, g: 112, b: 45);

// 转换为HSL颜色
HSL hslColor = rgbColor.toHsl();

print("HSL Color: $hslColor");

// 比较两个颜色是否相等
print("RGB and HSL are equal: ${rgbColor == hslColor}");

完整示例demo

下面是一个完整的示例程序，展示了如何使用 color_converter 插件来创建、修改和转换颜色：

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Color Converter Demo'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              ElevatedButton(
                onPressed: () {
                  // 创建RGB颜色并打印相关信息
                  final rgbColor = RGB(r: 234, g: 235, b: 120);
                  print("RGB Color: $rgbColor");
                  print("Hex: ${rgbColor.toHex()}");
                  print("CMYK: ${rgbColor.toCmyk()}");
                  print("HSB: ${rgbColor.toHsb()}");
                  print("HSL: ${rgbColor.toHsl()}");
                  print("LAB: ${rgbColor.toLab()}");
                  print("XYZ: ${rgbColor.toXyz()}");
                  print("RGB equals CMYK: ${rgbColor == CMYK(c: 0, m: 0, y: 49, k: 8)}");
                },
                child: Text('Print RGB Color Info'),
              ),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () {
                  // 创建HSB颜色并修改其属性
                  String hexColor = "#00ff00";
                  HSB hsbColor = HSB.fromHex(hexColor);
                  hsbColor.s = 10;
                  print("Modified HSB Color: $hsbColor");
                },
                child: Text('Modify HSB Color'),
              ),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () {
                  // 转换RGB到HSL颜色
                  RGB rgbColor = RGB(r: 234, g: 112, b: 45);
                  HSL hslColor = rgbColor.toHsl();
                  print("HSL Color: $hslColor");
                  print("RGB and HSL are equal: ${rgbColor == hslColor}");
                },
                child: Text('Convert RGB to HSL'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

这个示例程序创建了一个简单的Flutter应用，其中包含三个按钮，分别用于演示创建RGB颜色、修改HSB颜色以及将RGB颜色转换为HSL颜色的功能。每个按钮点击后都会在控制台输出相应的结果。