flutter 如何更改ElevatedButton和OutlinedButton的禁用颜色

vsnjm48y  于 2023-05-19  发布在  Flutter
关注(0)|答案(3)|浏览(236)

ElevatedButtonOutlinedButton小部件中没有这样的属性来像常规RaisedButton一样更改禁用的颜色。

ElevatedButton(
  onPressed: null,
  disabledColor: Colors.brown, // Error
}
nx7onnlm

nx7onnlm1#

如果只想更改禁用的颜色,请使用onSurface属性(此属性在OutlinedButton中也可用)。

ElevatedButton(
  onPressed: null,
  style: ElevatedButton.styleFrom(
    onSurface: Colors.brown,
  ),
  child: Text('ElevatedButton'),
)

如需更多自定义,请使用ButtonStyle

ElevatedButton(
  onPressed: null,
  style: ButtonStyle(
    backgroundColor: MaterialStateProperty.resolveWith<Color>((states) {
      if (states.contains(MaterialState.disabled)) {
        return Colors.brown; // Disabled color
      }
      return Colors.blue; // Regular color
    }),
  ),
  child: Text('ElevatedButton'),
)

要将其应用于应用中的所有ElevatedButton,请执行以下操作:

MaterialApp(
  theme: ThemeData(
    elevatedButtonTheme: ElevatedButtonThemeData(
      style: ElevatedButton.styleFrom(
        onSurface: Colors.brown
      ),
    ),
  ),
)
kgsdhlau

kgsdhlau2#

如果你想在应用中设置一个提升的按钮主题,你可以使用这个:

ThemeData(
  elevatedButtonTheme: ElevatedButtonThemeData(
    style: ElevatedButton.styleFrom(
      onSurface: Colors.brown
  ),
  child: Text('ElevatedButton')
))
0dxa2lsx

0dxa2lsx3#

这个答案被否决了。现在,您可以使用disabledForegroundColor和disabledBackgroundColor属性来控制按钮取消时的外观。
示例:

ElevatedButton(
  onPressed: null,
  style: ElevatedButton.styleFrom(
    disabledForegroundColor: Colors.grey[700],
disabledBackgroundColor: Colors.grey[300],
  ),
  child: Text('Disabled Elevated Button'),
)

OutlinedButton(
  onPressed: null,
  style: OutlinedButton.styleFrom(
    disabledForegroundColor: Colors.grey[400],
  ),
  child: Text('Disabled Outlined Button'),
)

相关问题