参数类型“MaterialColor”无法分配给参数类型“MaterialStateProperty”<Color>

Question

我有一个与新的 ElevatedButtonThemeData 小部件相关的问题，基本上我想为我的应用程序中的所有 ElevatedButton 设置背景颜色，我正在努力尝试通过执行以下操作在 ThemeData 定义中设置它：

      theme: ThemeData(
        ...
        elevatedButtonTheme: ElevatedButtonThemeData(
            style: ButtonStyle(backgroundColor: Colors.red)), // Here Im having the error
        ...
        ),
      ),

错误：

The argument type 'MaterialColor' can't be assigned to the parameter type 'MaterialStateProperty<Color?>?'.dartargument_type_not_assignable)

Answer 1

阅读文档后我找到了设置颜色的方法。

  theme: ThemeData(
    ...
    elevatedButtonTheme: ElevatedButtonThemeData(
        style: ButtonStyle(backgroundColor: MaterialStateProperty.all<Color>(Colors.red))), // Here Im having the error
    ...
    ),
  ),

Answer 2

这里是一个代码片段，展示了我如何使用材质状态属性设置文本按钮的样式。

您可以看到如何添加

different types

值：

TextButton(style: ButtonStyle(
      padding: MaterialStateProperty.all(const EdgeInsets.all(0)),
      elevation: MaterialStateProperty.all(8),
      shape: MaterialStateProperty.all(
          RoundedRectangleBorder(borderRadius: BorderRadius.circular(50))),
      backgroundColor: MaterialStateProperty.all(Colors.blue),
      shadowColor: MaterialStateProperty.all(
          Theme.of(context).colorScheme.onSurface),
    ),),

我希望这能给你一个想法。

想要了解更多关于MaterialStateProperty的内容，可以观看官方视频： 材质状态属性 |解码颤振

Answer 3

不要使用

ButtonStyle()

尝试：

style: ElevatedButton.styleFrom(backgroundColor: Colors.red)

Answer 4

MaterialStateProperty.all<Color>(Colors.red)

这将返回

MaterialStateProperty<Color?>

数据类型。

Answer 5

之前：

backgroundColor: Colors.green,

之后：

backgroundColor: MaterialStateProperty.all<Color>(Colors.green),

Answer 6

解决方案

backgroundColor 返回 ElevatedButton 内 MaterialStateProperty 的数据类型，因此使用

MaterialStateProperty.all(Colors.red))

或

例如

child: ElevatedButton(
          style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(Colors.red)),
          child: Text('Go Forwards To Screen 1'),
          onPressed: () {},
        ),

使用

style: ElevatedButton.styleFrom(backgroundColor: Colors.red)

Answer 7

MaterialStateProperty 已弃用，试试这个 （适用于任何按钮）

ElevatedButton(
               style: const ButtonStyle(
                     backgroundColor: WidgetStatePropertyAll<Color>(
                         Color.fromRGBO(234, 242, 255, 1)),),
               onPressed: () {},
               child: const Text(
                     "Proffesional",
                      style: TextStyle(
                                 fontWeight: FontWeight.w900,
                                 color: Color.fromRGBO(0, 111, 253, 1)),
            ));