更改 Flutter 中按钮的颜色和样式

Question

我已经迁移到 Flutter 2.0，这是现在的新版本。在我的项目中，我使用了 Flat Buttons 但它现在在 Flutter 2.0 中已被弃用，并且弹出建议使用 Text Button 而不是 Flat Buttons.

现在问题出在Flat Buttons有选项可以直接设置按钮的属性，例如color, padding etc.但是当我用Text Button替换它时使用这个属性有错误.我查看了文档，发现有style: ButtonStyle(backgroundcolor: ____________)的属性。但是当我把 Colors.blue 放在 backgroundcolor 属性中时，它给了我错误。

所以我想知道 Buttons 在 Flutter 2.0 中的行为如何以及我们如何 style Buttons?

我的代码片段在这里，我想在其中设置按钮的样式。

Container(
                  width: 200.0,
                  child: TextButton(
                    style: ButtonStyle(), // I want to style this.
                    onPressed: () => Navigator.pushNamed(context, SignupPage.id),
                    /*color: Colors.blue,
                    padding: const EdgeInsets.all(10.0),*/ //Commented code is deprecated in Flutter 2.0
                    child: Text(
                      'Create Account',
                      style: TextStyle(color: Colors.white, fontSize: 16.0),
                    ),

Answer 1

带有 backgroundcolor 的 style 参数是这样做的方法，但不带 Color 对象，它的类型是 MaterialStateProperty<Color?>? 所以你应该提供该类型的对象。

文档在这里https://api.flutter.dev/flutter/material/TextButton-class.html
这里 https://api.flutter.dev/flutter/material/ButtonStyle-class.html

Answer 2

按钮现在有一个状态，因此您必须为每个状态定义颜色：

您可以为所有状态定义一种颜色。

按钮样式( 背景颜色：MaterialStateProperty.all(Colors.green),
您可以为每个状态定义不同的颜色。

按钮样式( 背景颜色：MaterialStateProperty.resolveWith( （设置状态）{ 如果 (states.contains(MaterialState.pressed)) return Theme.of(上下文).colorScheme.primary.withOpacity(0.5); return空； // 使用组件的默认值。 }, ), ),

更改 Flutter 中按钮的颜色和样式

Changing the color and styling of the Button in Flutter

dart

flutter2.0