[Flutter]TextButtonのタップ中のテキストカラーを変えるには？

どうも、ちょげ(@chogetarou)です。

TextButtonのタップ中のテキストカラーを変える方法を紹介します。

方法

TextButtonのタップ中のテキストカラーを変えるには、まず引数「style」に「ButtonStyle」クラスを指定します。

次に、ButtonStyleクラスの引数「foregroundColor」に「MaterialStateProperty.resolveWith()」を指定します。

TextButton(
  child: Text('Button'),
  onPressed: () {},
  style: ButtonStyle(
    foregroundColor: MaterialStateProperty.resolveWith<Color>(),
  ),
)

最後に、「resolveWith」内にボタンのタップ中のテキストカラーを設定する処理を追加します。

TextButton(
  child: Text('Button'),
  onPressed: () {},
  style: ButtonStyle(
    foregroundColor: MaterialStateProperty.resolveWith<Color>(
      (Set<MaterialState> states) {
        if (states.contains(MaterialState.pressed)) {
          return Colors.pink; //タップ中のテキストカラー
        }
        return Colors.blue; //通常時のテキストカラー
      },
    ),
  ),
)