Swift로 iOS 앱에서 커스텀 알림창(대화 상자) 만드는 방법 완벽 가이드

Swift에서 UIAlertController로 대화 상자 구현하기

iOS 앱에서 사용자에게 메시지를 전달하거나 간단한 선택을 요청할 때 가장 많이 사용되는 UI 요소가 바로 알림창(Alert Dialog)입니다. Swift에서는 UIKit의 핵심 클래스인 UIAlertController를 활용해 손쉽게 대화 상자를 만들 수 있습니다.

이번 글에서는 빈 프로젝트를 하나 생성하고, 기본 뷰 컨트롤러 안에서 알림창을 만드는 과정을 단계별로 살펴보겠습니다.

1단계: UIAlertController 객체 생성

가장 먼저 알림창의 제목과 내용, 스타일을 지정하여 UIAlertController 인스턴스를 생성합니다.

let alert = UIAlertController.init(title: title, message: description, preferredStyle: .alert)

2단계: UIAlertAction으로 버튼 액션 추가

다음으로 사용자가 탭했을 때 실행될 동작을 담은 액션 객체를 만듭니다. 여기서는 기본 스타일의 'Ok' 버튼을 생성하고, 클로저 안에 원하는 커스텀 로직을 작성하면 됩니다.

let okAction = UIAlertAction.init(title: "Ok", style: .default) { _ in
    print("You tapped ok")
    //여기에 원하는 커스텀 동작을 추가하세요.
}

3단계: 알림창에 액션 등록 후 화면에 표시

생성한 액션을 알림창에 추가한 뒤, 현재 뷰 컨트롤러에서 present(_:animated:completion:) 메서드를 호출해 화면에 띄웁니다.

alert.addAction(okAction)
self.present(alert, animated: true, completion: nil)

재사용 가능한 함수로 만들기

매번 같은 코드를 반복해서 작성하는 대신, 위 과정을 하나의 함수로 묶어두면 어디서든 간편하게 호출할 수 있습니다.

func createAlert(withTitle title: String, andDescription description: String) {
    let alert = UIAlertController.init(title: title, message: description, preferredStyle: .alert)
    let okAction = UIAlertAction.init(title: "Ok", style: .default) {
        _ in print("You tapped ok")
        //여기에 원하는 커스텀 동작을 추가하세요.
    }
    alert.addAction(okAction)
    self.present(alert, animated: true, completion: nil)
}

뷰 컨트롤러에서 함수 호출하기

이제 viewWillLayoutSubviews() 메서드 안에서 위에서 만든 함수를 호출합니다. 실제 기기나 시뮬레이터에서 실행하면 아래와 같은 결과를 확인할 수 있습니다.

override func viewWillLayoutSubviews() {
    self.createAlert(withTitle: "This is an alert", andDescription: "Enter your description here.")
}

앱을 실행하면 화면 중앙에 제목과 설명이 표시된 알림창이 나타나고, 'Ok' 버튼을 누르면 콘솔에 로그가 출력되며 알림창이 닫히는 것을 볼 수 있습니다.

마무리 및 활용 팁

UIAlertController는 .alert 스타일 외에도 하단에서 올라오는 .actionSheet 스타일을 지원합니다. 또한 UIAlertAction.Style을 .destructive로 지정하면 삭제처럼 주의가 필요한 작업용 붉은색 버튼을, .cancel로 지정하면 취소 버튼을 쉽게 만들 수 있습니다. 텍스트 필드를 추가하는 addTextField 메서드를 활용하면 로그인 폼 같은 입력형 대화 상자도 구현할 수 있으니 다양하게 응용해 보시기 바랍니다.