Flutter　AppBarにサイドメニューを追加するサンプル

2024年1月12日

環境
Windows11 pro 64bit
Flutter 3.3.7

概要
AppBarにサイドメニューを追加するには、Drawerを使います。

@override
Widget build(BuildContext context) {
  return Scaffold(
    drawer: Drawer(),
    appBar: AppBar(
      title: Text(
        "タイトル",
      ),
    ),

Drawerを使うには、Scaffoldの引数「drawer」に、Drawerウェジェットを配置します。

使用例

@override
 Widget build(BuildContext context) {
   return Scaffold(
    drawer: Drawer(
       child: ListView(
         children: [
           ListTile(
             title: Text('会社概要'),
           ),
           Divider(),
           ListTile(
             title: Text('採用情報'),
           ),
           Divider(),
           ListTile(
             title: Text('交通情報'),
           )
         ],
       ),
     ),
     appBar: AppBar(
       title: Text(
         "タイトル",
       ),
     ),
     body: Center(),
   );
 }