[Flutter] AppBar의 뒤로가기 버튼 없애기

개요

Flutter에서 화면을 전환하면, 아무런 설정을 하지 않아도 다음과 같이 두번째 화면의 AppBar에 뒤로가기 버튼이 자동으로 생기는 것을 확인할 수 있습니다.

이번 블로그 포스트에서는 자동으로 생성된 AppBar의 뒤로가기 버튼을 숨기는 방법에 대해서 알아보도록 하겠습니다.

여기서 소개하는 소스코드는 GitHub에서 확인하실 수 있습니다.

GitHub: https://github.com/dev-yakuza/study-flutter/tree/main/widget/hide_back_button

뒤로가기 버튼 없애기

AppBar 위젯에서는 다음과 같이 leading가 설정이 되어 있지 않아도 뒤로가기 버튼이 표시됩니다.

class SecondScreen extends StatelessWidget {
  const SecondScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Second Screen'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () => Navigator.pop(context),
          child: const Text('Go Back'),
        ),
      ),
    );
  }
}

이렇게 표시된 뒤로가기 버튼을 없애기 위해서는 AppBar 위젯의 automaticallyImplyLeading을 사용할 필요가 있습니다.

automaticallyImplyLeading: https://api.flutter.dev/flutter/material/AppBar/automaticallyImplyLeading.html

뒤로가기 버튼을 없애고자 하는 화면에서 다음과 같이 AppBar 위젯의 automaticallyImplyLeading을 설정합니다.

class SecondScreen extends StatelessWidget {
  const SecondScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: false,
        title: const Text('Second Screen'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () => Navigator.pop(context),
          child: const Text('Go Back'),
        ),
      ),
    );
  }
}