Feat [#25] 커스텀 팝업 구현

[kim-seonwoo]

👾 작업 내용

• 이슈의 취지와 다르게 7개의 커스텀 팝업 알럿 창을 구현하였습니다.
• ViewModifier를 이용하여 구현하였습니다.
• 사용방법은 다음과 같습니다.

        .customAlert(
            isPresented: $viewModel.isPresented,
            customAlert: {
                CustomAlertView(
                    alertType: viewModel.alertType,
                    confirmBtn: CustomAlertButtonView(
                        buttonType: .Confirm,
                        alertType: viewModel.alertType,
                        isPresented: $viewModel.isPresented,
                        action: {}
                    ),
                    cancelBtn: CustomAlertButtonView(
                        buttonType: .Cancel,
                        alertType: viewModel.alertType,
                        isPresented: $viewModel.isPresented,
                        action: {}
                    )
                )
            }
        )

1. view 최상단에 modifier를 선언합니다.
2. isPresented와 같은 state bool 값을 선언하여 바인딩 하여 줍니다.
3. alertType 부분에는 CustomAlertType에 구현된 enum 중 하나를 입력해 줍니다. 7개의 팝업 타입입니다.

enum CustomAlertType {
    case unlock
    case unlockComplete
    case insufficientPoints
    case usePoints
    case withdraw
    case challengeCreationComplete
    case logout
    }

4. action: {} 부분에 해당 부분 버튼 클릭시 어떤 인터렉션이 일어날지 정의 해 주면 됩니다.

🚀 PR Point

• enum return 으로 무리하게 하려다가 시간을 많이 낭비 했네요.. 하하
• 현재는 마이 페이지 뷰 관련만 연결하 상태입니다. (로그아웃, 회원탈퇴)

📸 스크린샷

구현 내용	스크린샷
화면종류

✅ CheckList

• 오류 없이 빌드되는지 확인
• 로그용 print문 제거
• 불필요한 주석 제거
• 코드 컨벤션 확인

🔗 Issue

Resolved #25

[Zoe0929]

👍 ViewModifier 구현 뚝 딱. 좋아요! 잘 사용하겠습니다~

[Zoe0929]

❓ 여기는 잘못 올린 것 같아요! 처음에는 LoginView()가 맞는 것 같습니다~

[kim-seonwoo]

아 정답입니다@!

[Zoe0929]

👍 enum 이용한 야무진 구현 굳입니다 !!

[Zoe0929]

🤧 주석 필요없다면 지워주세요~