[flutter] 플러터 Drawer에서 뒤로가기 버튼의 동작을 설정하는 방법은?

플러터에서 Drawer는 앱의 주 메뉴를 표시하는 데 사용되는 프레임워크 요소입니다. 기본적으로 플러터에서 Drawer를 열면 앱의 메인 화면으로 이동합니다. 그러나 때로는 특정 화면으로 돌아가기 위해 뒤로가기 버튼을 눌렀을 때 Drawer를 닫는 동작을 사용자에게 제공하고 싶을 수도 있습니다.

이를 위해 Drawer에서 뒤로가기 버튼의 동작을 설정하는 방법은 다음과 같습니다:

  1. 먼저, 메인 앱의 Scaffold 위젯을 수정해야 합니다. Scaffold 위젯에서는 Drawer에 대한 글로벌 키를 설정할 수 있습니다.
return Scaffold(
  drawer: Drawer(
    // Drawer에 대한 GlobalKey 생성
    key: GlobalKey(),
    child: ListView(
      // Drawer 메뉴 아이템들
      children: [],
    ),
  ),
  // ...
);
  1. 이제 뒤로가기 버튼을 처리하기 위해 앱의 MaterialApp 위젯에서 WillPopScope 위젯으로 감싸야 합니다. 이 위젯을 사용하면 뒤로가기 버튼 이벤트를 수신하고 처리할 수 있습니다.
return MaterialApp(
  home: WillPopScope(
    // 뒤로가기 버튼 이벤트 처리
    onWillPop: () async {
      if (GlobalKey().currentState is DrawerState) {
        // Drawer가 열려 있는 경우
        GlobalKey().currentState.openEndDrawer();
        return false;
      } else {
        // Drawer가 닫혀 있는 경우
        return true;
      }
    },
    child: Scaffold(
      drawer: Drawer(
        key: GlobalKey(),
        child: ListView(
          children: [],
        ),
      ),
      // ...
    ),
  ),
  // ...
);
  1. 위의 코드에서는 if (GlobalKey().currentState is DrawerState)로 Drawer의 상태를 확인하여 현재 Drawer가 열려 있는지 닫혀 있는지 확인합니다. 만약 Drawer가 열려 있다면 openEndDrawer() 메서드를 사용하여 Drawer를 닫습니다.

이제 앱에서 뒤로가기 버튼을 누르면 Drawer가 열려 있다면 Drawer를 닫고, 닫혀 있다면 기본적인 뒤로가기 동작이 수행됩니다. 이를 통해 플러터 Drawer의 뒤로가기 버튼 동작을 설정할 수 있습니다.

참고 자료: