Flutter颜色转换插件beer_color_converter的使用

Dart包 beer_color_converter 可以将 SRM（Standard Reference Method）啤酒值转换为实际可见的颜色十六进制数。

使用方法

以下是一个完整的示例，展示如何在 Flutter 中使用 beer_color_converter 插件。

步骤 1: 添加依赖

首先，在 pubspec.yaml 文件中添加 beer_color_converter 作为依赖项：

dependencies:
  beer_color_converter: ^1.0.0

然后运行 flutter pub get 来安装依赖。

步骤 2: 导入包

在需要使用的 Dart 文件中导入 beer_color_converter 包：

import 'package:beer_color_converter/beer_color_converter.dart';

步骤 3: 转换 SRM 值为十六进制颜色

以下代码演示了如何将 SRM 值转换为十六进制颜色，并将其应用到一个 Flutter 小部件中：

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: BeerColorConverterExample(),
    );
  }
}

class BeerColorConverterExample extends StatefulWidget {
  @override
  _BeerColorConverterExampleState createState() =>
      _BeerColorConverterExampleState();
}

class _BeerColorConverterExampleState extends State<BeerColorConverterExample> {
  double srmValue = 10; // 示例 SRM 值
  String hexColor = '#FFFFFF'; // 初始默认颜色

  void updateHexColor(double newValue) {
    setState(() {
      srmValue = newValue;
      hexColor = BeerColorConverter.srmToHex(newValue);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Beer Color Converter 示例'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'SRM 值: $srmValue',
              style: TextStyle(fontSize: 20),
            ),
            SizedBox(height: 20),
            Container(
              width: 200,
              height: 200,
              decoration: BoxDecoration(
                color: Color(int.parse(hexColor.replaceAll('#', '0x'))),
                borderRadius: BorderRadius.circular(10),
              ),
              child: Center(
                child: Text(
                  hexColor,
                  style: TextStyle(fontSize: 18, color: Colors.white),
                ),
              ),
            ),
            SizedBox(height: 20),
            Slider(
              value: srmValue,
              min: 0,
              max: 100,
              divisions: 100,
              label: srmValue.round().toString(),
              onChanged: (value) => updateHexColor(value),
            ),
          ],
        ),
      ),
    );
  }
}

代码说明

1. 导入包：

   import 'package:beer_color_converter/beer_color_converter.dart';
   

   导入 beer_color_converter 包以便使用其功能。

2. 初始化 SRM 值和十六进制颜色：

   double srmValue = 10; // 示例 SRM 值
   String hexColor = '#FFFFFF'; // 初始默认颜色
   

3. 转换 SRM 值为十六进制颜色：

   String hexColor = BeerColorConverter.srmToHex(newValue);
   

   使用 BeerColorConverter.srmToHex() 方法将 SRM 值转换为十六进制颜色字符串。

4. 更新 UI： 使用 setState() 更新 SRM 值和对应的十六进制颜色，并重新绘制界面。

5. 滑动条控制 SRM 值：

   Slider(
     value: srmValue,
     min: 0,
     max: 100,
     divisions: 100,
     label: srmValue.round().toString(),
     onChanged: (value) => updateHexColor(value),
   )