[FLUTTER] GetX에서 안드로이드 뒤로 가기 버튼 제어하기

안드로이드 앱에서 뒤로 가기 버튼을 눌렀을 때의 기본 동작은 이전 화면으로 돌아가는 것입니다.PopScope를 통해 이러한 행동을 막고 원하는 방법을 적용할수 있지만, 안드로이드 api 33에서는 enableOnBackInvokedCallback="false" 를 적용해줘야 하기도 합니다. 그럼에도 불구하고 만약 위 두가지 방법으로 해결이 안된다면 route 자체에 문제가 발생한것일수도 있습니다.
제 같은 경우에는 Getx 5.0.0-release-candidate-9.x에서 다음과 같은 문제가 발생했습니다. Go_router 13.x 버전에서도 이와 비슷한 문제가 발생하는것 같습니다.

이렇게 라우팅과 충돌이나는 상황에서 BackButtonInterceptor를 이용하여 뒤로 가기 동작을 방지하거나 커스터마이징하는 방법을 알아보겠습니다.

1. GetX의 Get.back() 방지하기

GetX에서는 기본적으로 뒤로 가기 버튼을 누르면 Get.back()이 호출됩니다. 이 동작을 막기 위해 WillPopScope를 사용할 수도 있지만, GetX에서는 BackButtonInterceptor라는 유용한 도구를 제공합니다.
BackButtonInterceptor는 뒤로 가기 버튼이 눌렸을 때의 동작을 가로채어 처리할 수 있도록 합니다. 이 도구를 사용하면 매우 세밀하게 뒤로 가기 동작을 제어할 수 있습니다.

2. BackButtonInterceptor 사용하기

BackButtonInterceptor는 뒤로 가기 버튼을 눌렀을 때 커스텀 동작을 추가하거나 기본 동작을 막을 수 있습니다. 이를 사용하여 페이지별로 뒤로 가기 동작을 제어할 수 있습니다.

다음은 BackButtonInterceptor를 사용하는 간단한 예시입니다.

import 'package:back_button_interceptor/back_button_interceptor.dart';
import 'package:flutter/material.dart';

class MyPage extends StatefulWidget {
  @override
  _MyPageState createState() => _MyPageState();
}

class _MyPageState extends State<MyPage> {
  @override
  void initState() {
    super.initState();
    BackButtonInterceptor.add(myInterceptor); // 뒤로 가기 버튼 인터셉터 추가
  }

  @override
  void dispose() {
    BackButtonInterceptor.remove(myInterceptor); // 인터셉터 제거
    super.dispose();
  }

  bool myInterceptor(bool stopDefaultButtonEvent, RouteInfo info) {
    // 뒤로 가기 버튼이 눌렸을 때 동작
    print("뒤로 가기 버튼이 눌렸습니다!");
    return true; // true를 반환하면 기본 동작을 막습니다.
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('My Page')),
      body: Center(child: Text('뒤로 가기 버튼 테스트')),
    );
  }
}

설명:

BackButtonInterceptor.add(myInterceptor)로 인터셉터를 추가합니다. 이 인터셉터는 뒤로 가기 버튼이 눌렸을 때 myInterceptor 함수가 호출되도록 합니다.
myInterceptor 함수에서 true를 반환하면 기본 동작(뒤로 가기)이 막히고, false를 반환하면 기본 동작이 실행됩니다.
페이지가 사라질 때 BackButtonInterceptor.remove(myInterceptor)를 호출하여 인터셉터를 해제해야 합니다.

3. BackButtonInterceptor의 활용

BackButtonInterceptor는 여러 페이지에서 뒤로 가기 동작을 각각 다르게 처리해야 할 때 유용합니다. 예를 들어, 특정 페이지에서는 뒤로 가기를 완전히 막고, 다른 페이지에서는 사용자에게 확인 메시지를 보여주고 싶을 때 사용할 수 있습니다.

bool myInterceptor(bool stopDefaultButtonEvent, RouteInfo info) {
  if (info.currentRoute == '/specificPage') {
    // 특정 페이지에서만 뒤로 가기 동작 막기
    return true;
  }
  return false; // 다른 페이지에서는 기본 동작 허용
}