Flutter ElevatedButtonのクリック時の色を指定する

Flutter ElevatedButtonのクリック時の色を指定する

Flutterで、ElevatedButtonのクリック時の色を指定する手順を記述してます。「styleFrom」で「onPrimary」を設定することで指定することができます。

環境

  • OS  windows11 pro 64bit
  • Flutter 3.3.1

クリック時の色を指定

クリック時の色を指定するには、「styleFrom」で「onPrimary」を設定します。

        child: ElevatedButton(
          onPressed: () {},
          style: ElevatedButton.styleFrom(
            primary: Color.fromARGB(255, 218, 56, 56), //ボタンの背景色
            onPrimary: Colors.black, // クリックで背景色を黒に
          ),
          child: Text(
            "Button",
            style: TextStyle(
              color: Color.fromARGB(255, 255, 255, 255), // ボタンのテキストの色
              fontSize: 12,
            ),
          ),
        ),

これで「ElevatedButton」のクリック時の色が反映されます。