Flutter 는 Android, iOS 둘 다 개발 가능하다.
그래서 두가지 플랫폼에 대해 공통적인 작업이 많다.
하지만 몇몇 작업에 대해서는 플랫폼의 특징에 의해 개별적인 작업이 필요하다.
대표적인 예가 안드로이드의 뒤로가기. 즉 Back 버튼에 대한 처리다.
Android의 Back 버튼
Android 에서 뒤로가기 버튼은 다양한 방식으로 반응한다.
페이지 뒤로가기, 앱 종료하기, 알림창 띄우기 등이다.
대부분은 이전에 켰었던 상위 페이지로 이동하다가 더이상 이동할 페이지가 없으면 팝업 메세지를 띄우게 된다.
'앱을 종료하시려면 한번 더 뒤로가기 버튼을 눌러주십시오'
그리고 이때 한번 더 Back 버튼을 누르게 되면 종료되는 방식이다.
Flutter에서는 어떻지?
Flutter에서는 뒤로가기 버튼을 클릭시 Navigator로 이동한 페이지들을 Pop으로 거슬러 올라간다.
그러다 최상위 페이지로 올라간 후 뒤로가기 버튼이 눌러지면 앱이 꺼지도록 설정되어 있다.
이는 다양한 상황에서 예기치 못한 상황을 유발할 수 있다.
앱의 메인페이지로 이동하려고 뒤로가기 버튼을 누르다가 앱을 종료할수도 있다.
혹은 중요한 정보를 입력한 페이지를 벗어나 입력했던 정보를 다시 입력하게 될수도 있다.
그래서 특정한 상황에서는 이 Back 버튼에 대한 이벤트를 관리해야 한다.
Back 버튼, WillPopScope로 관리
간단한 위젯으로 Back 버튼을 관리할 수 있다.
우리가 기존에 사용하던 위젯을 WillPopScope Widget으로 감싸주면 끝이다.
class MainScreen extends StatelessWidget {
const MainScreen({super.key});
@override
Widget build(BuildContext context) {
return WillPopScope( //이 위젯이 뒤로가기를 제어한다.
onWillPop: () async {
return true;//값이 false라면 뒤로가기가 방지된다.
},
child: const Scaffold(
body: Center(위와 같이 WillPopScope로 내가 원하는 Widget을 감싸준다.
그리고 onWillPop 을 호출하여 return 값을 bool로 반환한다.
이때 async로 반환하는것을 볼 수 있다.
즉 onWillPop은 Future 형식이다.
저 함수 안에 다양한 요소를 넣어서 뒤로가기 클릭시 원하는 행동을 작성할 수 있다.
혹시 이 글을 보고 추가적인 팁을 주고싶은 분들은 댓글로 얼마든지 알려주시면 감사합니다.
땡큐!
