[Flutter]ElevatedButtonのボタンの背景色と文字色の設定・変更方法

Flutter2.0以降は、ボタンのWidgetが「RaisedButton」から「ElevatedButton」に変更されましたが、

「ElevatedButton」の背景色及びボタンに表示させる文字色を設定・変更する場合は、

• ElevatedButtonのstyle属性で、「ElevatedButton.styleFrom」メソッドを使って
• ボタンの背景色は「primary」属性で
• 文字色は「onPrimary」属性で

設定します。

RaisedButton(
  color: Colors.red, // background
  textColor: Colors.white, // foreground
  onPressed: () { },
  child: Text('RaisedButton with custom foreground/background'),
)

ElevatedButton(
  style: ElevatedButton.styleFrom(
    primary: Colors.red, // background
    onPrimary: Colors.white, // foreground
  ),
  onPressed: () { },
  child: Text('ElevatedButton with custom foreground/background'),
)

New Buttons and Button Themes

The basic material button classes have been replaced.

（以下の動画でも解説していますので、よろしければご覧下さい）