프로그래밍/flutter

[flutter] 백버튼(뒤로가기) 클릭시 "종료하시겠습니까?" 다이얼로그 추가

소행성왕자 2023. 8. 16. 10:58

뒤로가기 버튼을 클릭했을 때 "종료하시겠습니까?"와 관련된 기능을 추가하려면 

WillPopScope 위젯을 사용하여 백 버튼 이벤트를 처리할 수 있습니다. 

아래와 같이 코드를 수정하여 "뒤로가기" 버튼 클릭 시 종료 여부를 묻는 다이얼로그를 표시할 수 있습니다.

기존코드

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter WebView 11'),
      ),
      body: WebViewWidget(
        controller: controller,
      ),
    );

수정코드

  
  
  Future<bool> _onWillPop() async {
    return await showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: Text('종료하시겠습니까?'),
        actions: <Widget>[
          TextButton(
            onPressed: () => Navigator.of(context).pop(false),
            child: Text('아니오'),
          ),
          TextButton(
            onPressed: () => Navigator.of(context).pop(true),
            child: Text('예'),
          ),
        ],
      ),
    ) ?? false;
  }
  
  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: _onWillPop,
      child: Scaffold(
        body: WebViewWidget(
          controller: controller,
        ),
      ),
    );
  }

위 코드에서 WillPopScope 위젯은 뒤로가기 이벤트를 감지하고 _onWillPop 함수를 호출합니다.

 _onWillPop 함수에서는 다이얼로그를 표시하고 "예" 버튼을 클릭하면 true를 반환하여 앱을 종료하고

"아니오" 버튼을 클릭하면 false를 반환하여 종료하지 않도록 처리합니다.