Flutter - Drawer 만들기 [8]

 

1. Drawer

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Welcome to Flutter',
      home: MainPage(),
    );
  }
}

class MainPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        drawer: Drawer(
          child: ListView(
            padding: EdgeInsets.zero,
            children: [
              DrawerHeader(
                child: Text('Drawer Header'),
                decoration: BoxDecoration(
                  color: Colors.blue,
                ),
              ),
              ListTile(
                title: Text('Item 1'),
                onTap: () {},
              )
            ],
          ),
        ),
        appBar: AppBar(
          title: Text('MainPage'),
          actions: [
            Icon(Icons.search),
          ],
        ),
        body: Center(
            child: Text('Main Page')
        )
    );
  }
}

MainPage

​ : 버튼을 누르면 서브페이지로 이동한다.

​ drawer: Drawer를 생성하여 지정한다.

​ - Drawer: AppBar왼쪽의 버튼(따로 만들지 않아도 생김)을 누르면 왼쪽에 drawer가 생기고 안의 내용을 Widget으로 지정할 수 있다.