こんにちは！
今回はサイドバーに動きをつけた内容を紹介します。

使用パッケージ

実装内容

実際のコード

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: SimpleHiddenDrawer(
        menu: const InnerDrawerOne(),//サイドメニューの内容を定義
        screenSelectedBuilder: //メインのコンテンツをビルドするためのコールバック
            (position, controller) {
              Widget screenCurrent;

          switch (position) { //値に応じて、選択された画面を決定
            case 0:
              screenCurrent = const Newfile();//クラスを指定
              break;
            case 1:
              screenCurrent = DateSelect();//クラスを指定
              break;
            case 2:
              screenCurrent = const QiitaSample1();//クラスを指定
              break;
            default:
              screenCurrent = const Newfile(); // デフォルトのウィジェットを設定
              break;
          }

          return Scaffold(
            backgroundColor: Colors.yellow,
            appBar: AppBar(
              leading: IconButton(
                icon: const Icon(Icons.menu),
                onPressed: () {
                  controller.toggle();
                },
              ),
            ),
            body: screenCurrent,
          );
        },
      ),
    );
  }
}

参考サイト

終わり

今回の紹介は以上になります。
今回も読んでいただき、ありがとうございました。