[Flutter] Drawer

Bumhyeon Baek·2023년 5월 9일
0

Flutter

목록 보기
8/14
post-custom-banner

Drawer

응용 프로그램에서 네비게이션 링크를 보여주기 위해 Scaffold의 가장자리에서 수평으로 슬라이드 되는 Material Design 패널
일반적으로 Scaffold.drawer 속성과 함께 사용된다. Drawer의 자식은 일반적으로 첫 번째 자식이현재 사용자에 대한 상태 정보를 표시하는 DrawerHeader인 ListView이다. 나머지 자식은 종종 AboutListTile로 끝나는 ListTiles로 구성된다.

Scaffold(
  appBar: AppBar(
    title: const Text('Drawer Demo'),
  ),
  drawer: Drawer(
    child: ListView(
      padding: EdgeInsets.zero,
      children: const <Widget>[
        DrawerHeader(
          decoration: BoxDecoration(
            color: Colors.blue,
          ),
          child: Text(
            'Drawer Header',
            style: TextStyle(
              color: Colors.white,
              fontSize: 24,
            ),
          ),
        ),
        ListTile(
          leading: Icon(Icons.message),
          title: Text('Messages'),
        ),
        ListTile(
          leading: Icon(Icons.account_circle),
          title: Text('Profile'),
        ),
        ListTile(
          leading: Icon(Icons.settings),
          title: Text('Settings'),
        ),
      ],
    ),
  ),
)
profile
Cool Leader
post-custom-banner

0개의 댓글