[flutter] 플러터 Scaffold에서 drawer의 아이템을 구성하는 방법은 어떻게 되나요?

12 Dec 2023

flutter

다음은 drawer를 포함한 Scaffold의 예시 코드입니다.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Drawer 예제'),
        ),
        drawer: Drawer(
          child: ListView(
            padding: EdgeInsets.zero,
            children: <Widget>[
              DrawerHeader(
                decoration: BoxDecoration(
                  color: Colors.blue,
                ),
                child: Text('Drawer 헤더'),
              ),
              ListTile(
                title: Text('메뉴 1'),
                onTap: () {
                  // 메뉴 1을 선택했을 때의 동작
                },
              ),
              ListTile(
                title: Text('메뉴 2'),
                onTap: () {
                  // 메뉴 2를 선택했을 때의 동작
                },
              ),
            ],
          ),
        ),
        body: Center(
          child: Text('메인 화면'),
        ),
      ),
    );
  }
}

위 코드에서 Drawer 위젯 안에 ListView를 사용하여 drawer의 아이템을 구성하고 있습니다. ListTile 위젯을 사용하여 각 메뉴 항목을 표시하고, onTap 콜백을 이용하여 해당 메뉴를 선택했을 때의 동작을 지정할 수 있습니다.

이렇게 하면 Scaffold에서 drawer의 아이템을 구성할 수 있습니다.