[Flutter] showDialog 뒤로가기

 

showDialog를 사용할 때, 뒤로가기를 통해 다이얼로그를 닫는 것을 방지하고 싶을 때가 있습니다.

이는 Android로 따지면 AlertDialog의 setCancelable(false) 과 같은 기능을 기대하는 것입니다.

 

Flutter의 showDialog에는 barrierDismissible 라는 속성이 있습니다.

기본값은 true이며, false를 넣어주면 뒤로가기를 무력화시켜줌을 기대할 수 있지만 안타깝게도 그렇지 않습니다.

다이얼로그 밖 화면을 터치했을 때 다이얼로그가 닫히는지의 여부일 뿐, 뒤로가기를 제어할 순 없습니다.

 

 

setCancelable(false) 기능을 위해선, WillPopScope 위젯을 이용하면 됩니다.

  showDialog(
    barrierDismissible: false,
    context: context,
    builder: (context) => WillPopScope(
      onWillPop: () async {
        return false;
      },
      child: Center(
        child: Container(
          width: 60.0,
          height: 60.0,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(4.0),
          ),
          child: Padding(
            padding: const EdgeInsets.all(12.0),
            child: CupertinoActivityIndicator(),
          ),
        ),
        ),
    ),
  );

 

이렇게 onWillPop의 리턴값으로 false를 남기게 되면, 뒤로가기가 불가능하게 됩니다.

따라서 dialog가 띄워져 있는 상황에서 뒤로가기로 다이얼로그를 닫을 수 없는 효과를 달성할 수 있게 됩니다.