[Flutter] AlertDialog를 통한 앱 강제 업데이트 방법

앱 강제 업데이트 하는 방법에 대한 가이드 입니다.

// show force update dialog
  void showForceUpdateDialog(bool forceUpdate) {
    showDialog(
        barrierDismissible: false,
        context: context,
        builder: (context) {
          return WillPopScope(
            onWillPop: () async => false,
            child: AlertDialog(
              title: Text(forceUpdate ? '업데이트가 필요' : '새로운 버전 출시'),
              content: Text(forceUpdate ? '중요한 변경으로 인해 업데이트를 해야만 앱을 이용할 수 있어요.' : '업데이트를 하고 새로운 기능을 만나보세요.'),
              actions: [
                if (!forceUpdate)
                  TextButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      child: const Text('나중에')),
                TextButton(
                    onPressed: () async {
                      // Navigator.pop(context);
                      // 앱 업데이트
                      StoreRedirect.redirect(androidAppId: 'com.xxxx.xxx', iOSAppId: PropertyManager.PROPERTY[PropertyManager.iosPackageName] ?? 'idxxx');
                    },
                    child: const Text('업데이트'))
              ],
            ),
          );
        });
  }

플레이스토어 앱스토어로 이동할 수 있게 하는 라이브러리 설치

https://pub.dev/packages/store_redirect

store_redirect | Flutter Package

해당 패키지를 통해 아래와 같이 호출

StoreRedirect.redirect(androidAppId: 'com.xxxx.xxx', iOSAppId:'idxxx');

그럼 준비는 끝났다. 해당 ID 값에 각각 스토어에 등록된 ID값과 패키지명을 넣으면 된다.

 

여기서 중요한 꿀팁 alertDialog가 안드로이드 back 버튼이나 화면 밖을 터치시에 팝업이 닫히는 현상을 발견하여 아래와 같이 개선하였다.

 

기존코드

void showForceUpdateDialog(bool forceUpdate) {
    showDialog(
        context: context,
        builder: (context) {
          return AlertDialog(
            title: Text(forceUpdate ? '업데이트가 필요' : '새로운 버전 출시'),
            content: Text(forceUpdate ? '중요한 변경으로 인해 업데이트를 해야만 앱을 이용할 수 있어요.' : '업데이트를 하고 새로운 기능을 만나보세요.'),
            actions: [
              if (!forceUpdate)
                TextButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: const Text('나중에')),
              TextButton(
                  onPressed: () async {
                    // Navigator.pop(context);
                    // 앱 업데이트
                    StoreRedirect.redirect(androidAppId: PropertyManager.PROPERTY[PropertyManager.androidPackageName] ?? 'com.xxx.xxx', iOSAppId: PropertyManager.PROPERTY[PropertyManager.iosPackageName] ?? 'id1xx7');
                  },
                  child: const Text('업데이트'))
            ],
          );
        });
  }

개선코드

- barrierDismissible: false 로 설정 : 배경 터치시 꺼지지 않게

- WillPopScope 추가 - onWillPop: () async => false

// show force update dialog
  void showForceUpdateDialog(bool forceUpdate) {
    showDialog(
        barrierDismissible: false,
        context: context,
        builder: (context) {
          return WillPopScope(
            onWillPop: () async => false,
            child: AlertDialog(
              title: Text(forceUpdate ? '업데이트가 필요' : '새로운 버전 출시'),
              content: Text(forceUpdate ? '중요한 변경으로 인해 업데이트를 해야만 앱을 이용할 수 있어요.' : '업데이트를 하고 새로운 기능을 만나보세요.'),
              actions: [
                if (!forceUpdate)
                  TextButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      child: const Text('나중에')),
                TextButton(
                    onPressed: () async {
                      // Navigator.pop(context);
                      // 앱 업데이트
                      StoreRedirect.redirect(androidAppId: 'com.xxxx.xxx', iOSAppId: PropertyManager.PROPERTY[PropertyManager.iosPackageName] ?? 'idxxx');
                    },
                    child: const Text('업데이트'))
              ],
            ),
          );
        });
  }