Flutter - 如何更改放置在自定义小部件内的 Color 类的值？答案

【问题标题】：Flutter - How to change the Color class' value that placed inside a custom widget?Flutter - 如何更改放置在自定义小部件内的 Color 类的值？
【发布时间】：2020-09-20 12:33:39
【问题描述】：

我想创建一个我会经常使用它的小部件，所以我不必手动创建它。

这是我构建的：

    Widget keyWidget(String keyNumber, String keyName) {
          return Container(
              width: 100.0,
              height: 50.0,
              color: Colors.red, //How I change the color's value? (Colors.{this_one})?
              child: FlatButton(
                onPressed: () {
                  final player = AudioCache();
                  player.play('key$keyNumber.mp3');
                },
                child: Text('$keyName'),
              ),
            );
}

如何更改颜色值 (color: Colors.{this_one},) 以便可以在 keyWidget 属性中设置它？

【问题讨论】：

标签： flutter dart flutter-widget

【解决方案1】：

您可以将您的 Color 作为参数传递给您的 keyWidget() 方法

试试这个方法

 Widget keyWidget(String keyNumber, String keyName,Color mColor) {
          return Container(
              width: 100.0,
              height: 50.0,
              color: mColor, //How I change the color's value? (Colors.{this_one})?
              child: FlatButton(
                onPressed: () {
                  final player = AudioCache();
                  player.play('key$keyNumber.mp3');
                },
                child: Text('$keyName'),
              ),
            );
}

现在你可以像这样调用这个方法了。

keyWidget('keyNumber','keyName',Colors.red);
keyWidget('keyNumber','keyName',Colors.pink);
keyWidget('keyNumber','keyName',Color(0xffACACAC));

您也可以将Color 参数设为可选

示例代码

Widget keyWidget(String keyNumber, String keyName,{ mColor=Colors.red}) {
    return Container(
      width: 100.0,
      height: 50.0,
      color: mColor, //How I change the color's value? (Colors.{this_one})?
      child: FlatButton(
        onPressed: () {
          final player = AudioCache();
          player.play('key$keyNumber.mp3');
        },
        child: Text('$keyName'),
      ),
    );
  }

现在你可以像这样调用这个方法了。

keyWidget('keyNumber', 'keyName');
keyWidget('keyNumber', 'keyName',mColor:  Colors.accents);

【讨论】：