【Flutter】StatelessWidgetでも使用できるトグルボタン

背景

筆者はFlutter初心者のため、StatelessWidgetでも使用できるトグルボタンを探していたところ、Switch.adaptiveというトグルボタンを見つけました。

検証したPC環境

PC: Apple M2
MacOS: Sonoma 14.0
メモリ: 16GB
Xcode: 15.0,1
VScode: 1.89.1

コード

StatelessWidetは状態を内部で持たないため、外部でスイッチの状態を管理する必要があります。

class MyHomePageState extends StatelessWidget {
  const MyHomePageState({super.key});

  @override
  Widget build(BuildContext context) {
    //外部から状態を取得
    switchValue = ref.watch(SwitchStateNotifierProvider);
    return Scaffold(
      appBar: AppBar(
        title: Text('Switch.adaptive Example'),
      ),
      body: Center(
        child: Switch.adaptive(
          //状態を参照、スイッチの描写に反映
          value: switchValue,
          onChanged: (bool newValue) {
              //状態を変更
              switchValue = newValue;
            });
          },
        ),
      ),
    );
  }
}