NEW ARTICLE
Rocky LinuxにおけるJournaldの詳細なログ管理
  1. HOME
  2. flutter
  3. Flutter ボタンクリックでボタンのテキストを変更する

Flutter ボタンクリックでボタンのテキストを変更する

Flutter ボタンクリックでボタンのテキストを変更する

Flutterで、ボタンクリックでボタンのテキストを変更する手順を記述してます。

目次

環境

  • OS  windows11 pro 64bit
  • Flutter 3.3.1

ボタンクリックでボタンのテキストを変更する

ボタンクリックでボタンのテキストを変更するには、フラグをもってクリック（onPressed）時にテキストを切り替えます。

class _MyHomePageState extends State<MyHomePage> {
  bool pressOn = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter'),
      ),
      body: Center(
        child: ElevatedButton(
          child: pressOn ? const Text("on") : const Text("off"),
          onPressed: () => {
            setState(() {
              pressOn = !pressOn;
            })
          },
        ),
      ),
    );
  }
}

クリックするとbuttonのテキストが変更されていることが確認できます。