[Flutter] CupertinoAlertdialog 사용하는 방법

CupertinoAlertDialog 만들기

flutter 에서 CupertinoAlertDialog 를 만드는 방법은 아래 주소를 참고 하시면 됩니다. 

https://api.flutter.dev/flutter/cupertino/CupertinoAlertDialog-class.html

CupertinoAlertDialog class - cupertino library - Dart API

const CupertinoAlertDialog({
    super.key,
    this.title,
    this.content,
    this.actions = const <Widget>[],
    this.scrollController,
    this.actionScrollController,
    this.insetAnimationDuration = const Duration(milliseconds: 100),
    this.insetAnimationCurve = Curves.decelerate,
  }) : assert(actions != null);

CupertinoAlertDialog의 생성자는 위와 같습니다. 

저는 이번에 사진촬영 또는 갤러리에서 선택하는 것을 만들어 보았습니다. 
Action에 대해서는 따로 주면서 진행을 해 보았습니다. 

기존 소스는 아래처럼 구현을 이벤트를 클릭을 해도 창이 사라지지가 않더라구요. ㅠ. ㅠ

 showCupertinoDialog(context: context,
                        barrierDismissible: true,
                        builder: (context){
                      return CupertinoAlertDialog(
                        title: const Text('SNS 등록'),
                        actions: [
                          // ElevatedButton(onPressed: _uploadCameraImage, child: const Text('사진 촬영')),
                          // ElevatedButton(onPressed: _uploadGalleryImage, child: const Text('갤러리 선택')),
                          GestureDetector(
                            onTap: _uploadCameraImage,
                            child: const Text('사진촬영', style: TextStyle(fontSize: 20),),
                          ),
                          GestureDetector(
                            onTap: _uploadGalleryImage,
                            child: const Text('갤러리선택', style: TextStyle(fontSize: 20),),
                          ),

                        ],
                      );
                    });

반응형

개선된 소스는 아래와 같습니다. 
Navigator.pop(context);가 있어서 팝업창의 이벤트를 호출하고 창이 닫아지는 소스입니다. 

void _showAlertDialog(BuildContext context) {
    showCupertinoModalPopup<void>(
      context: context,
      builder: (BuildContext context) => CupertinoAlertDialog(
        title: const Text('SNS 등록'),
        content: const Text('SNS 등록을 위해서 파일을 선택해주세요'),
        actions: <CupertinoDialogAction>[
          CupertinoDialogAction(
            isDefaultAction: true,
            onPressed: () {
              _uploadCameraImage();
               Navigator.pop(context);
            },
            child: const Text('사진촬영'),
          ),
          CupertinoDialogAction(
            isDefaultAction: true,
            onPressed: () {
              _uploadGalleryImage();
              //아래는 선택후에 팝업창이 본 화면으로 가기위한 옵션
              Navigator.pop(context);
            },
            child: const Text('갤러리에서 선택'),
          ),
        ],
      ),
    );
  }

위의 소스를 보시면 onPressed에  함수를 호출하는 구조로 만들어졌답니다. 
역시 flutter에서 BuildContext를 파라미터로 사용하는것은 이해가 많이 필요하네요. 
Flutter는 한동안 안 보다가 다시 보니 새삼 다시 공부하는 구조가 되어버렸네요.