⭐️ UIAlertController
사용자에게 경고 메시지를 보여주거나 확인이 필요한 경우에 알림 창을 띄워주는 기능을 제공하는 클래스입니다!
이제 본격적으로 사용해볼까요? 🙌
먼저 프로젝트를 생성하고 스토리보드의 뷰에 Alert와 Action Sheet 두 개의 버튼을 만들어 줍니다!
각각의 버튼을 눌렀을 때 나오는 알림창은 다음과 같습니다
이렇게 만들어 주고 나면 함수와 연결 시켜줘야 하는데요
함수는 두 가지를 만들겁니다!
위의 사진처럼 각 버튼마다 다른 스타일의 알림 창이 뜨도록 구현해볼 거예요
Alert는 touchUpAlertButton함수와 Action Sheet는 touchUpActionSheetButton함수와 연결시켜줍니다!
근데 두 함수는 UIAlertController 인스턴스를 생성할 때만 차이가 나서 touchUpAlertButton 함수를 구현해보도록 할게요 :)
지금부터 나오는 내용은 모두 함수 안에 들어가는 코드입니다!
1️⃣ UIAlertController를 사용하여 알림 창의 전체적인 부분 만들어주기
이렇게 alert 인스턴스를 생성하여 알림 창의 전체적인 부분을 만들어주고 title과 message를 정해줄 수 있습니다!
마지막에 있는 preferredStyle은 alert와 actionSheet 이렇게 두 가지가 있는데요
이는 알림 창을 어떤 스타일로 띄울것인지 정해줄 수 있습니다
왼쪽이 actionSheet로 적용했을 때 오른쪽이 alert로 적용했을 때 입니다!
touchUpActionSheetButton 함수를 구현해주실 때는 preferredStyle을 .actionSheet로 지정해주시면 됩니다!
2️⃣ UIAlertAction을 사용하여 액션 버튼 만들어주기
위에 사진을 보시면 OK, REMOVE, CANCEL 버튼이 있죠? 바로 이 버튼을 만들어주는 작업을 할겁니다!
title은 버튼 제목을, style은 글씨 스타일을 설정해줍니다. 위의 사진을 자세히 보시면 OK(.default) 와 REMOVE(.destructive) 의 글씨 굵기가 같고 CANCEL(.cancel) 버튼은 더 굵은 것을 알 수 있습니다. 또한, REMOVE는 빨간색으로 설정되어있습니다.
여기서 잠깐✋
스타일이 cancel인 버튼은 하나만 생성해줄 수 있습니다❗️
마지막으로 handler는 알림 창의 버튼을 눌렀을 때 어떤 행동을 할건지 설정해줄 수 있습니다.
((UIAlertAction) -> Void)? 를 클릭하시고 엔터를 치면 다음과 같이 클로저가 나옵니다!
이렇게 클로저를 이용하여 행동을 구현해주면 되는데요
예시처럼 아무 행동도 하지 않는다면, nil을 지정해주면 됩니다!
3️⃣ 알림 창과 액션 버튼 연결해주기
위에서 알림 창을 만들어주고 액션 버튼을 만들어줬는데요
이제 이 두 개를 합쳐주는 작업을 해줘야합니다!
이렇게 alert에 만들어둔 UIAlertAction 객체들을 add해주면 됩니다!
여기서 추가한 순서대로 버튼이 생성되는데요
다만! cancel 버튼 즉, 스타일이 cancel인 버튼은 맨 처음에 추가를 해줬다하더라도 맨 마지막에 위치합니다!
4️⃣ 화면에 띄워주기
이제 마지막으로 이렇게 만들어준 alert view를 화면에 띄워주는 작업을 해야겠죠?
이렇게 present 메서드를 통해 만들어주시면 됩니다!
매개변수는 위에서 만들었던 UIAlertController 인스턴스인 alert와 animated, completion을 넣어줘야합니다
animated는 애니메이션을 넣을건지 설정(true/false)해주는 것이고 completion은 이 메서드가 수행되고 나면 어떤 행동을 할건지 지정해주는 함수입니다!
위에 나왔던 handler와 마찬가지로 아무 행동도 하지 않을거라면 nil을 넣어주면되지만 어떤 행동을 취해주고 싶다면
중괄호 안에 하고 싶은 행동의 코드를 작성해주시면 됩니다!
마지막으로!
액션버튼을 두 가지 이상 사용하고 싶다면, actionSheet를 사용하는 것을 추천드립니다~!!
다음은 전체 소스입니다
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
}
@IBAction func touchUpAlertButton(_ sender: UIButton) {
let alert = UIAlertController(title: "Alert", message: "This is an alert!", preferredStyle: .alert)
let okAction = UIAlertAction(title: "OK", style: .default, handler: nil)
let removeAction = UIAlertAction(title: "REMOVE", style: .destructive, handler: nil)
let cancelAction = UIAlertAction(title: "CANCEL", style: .cancel, handler: nil)
alert.addAction(okAction)
alert.addAction(removeAction)
alert.addAction(cancelAction)
present(alert, animated: true, completion: nil)
}
@IBAction func touchUpActionSheetButton(_ sender: UIButton) {
let alert = UIAlertController(title: "Alert", message: "This is an alert!", preferredStyle: .actionSheet)
let okAction = UIAlertAction(title: "OK", style: .default, handler: nil)
let removeAction = UIAlertAction(title: "REMOVE", style: .destructive, handler: nil)
let cancelAction = UIAlertAction(title: "CANCEL", style: .cancel, handler: nil)
alert.addAction(okAction)
alert.addAction(removeAction)
alert.addAction(cancelAction)
present(alert, animated: true, completion: nil)
}
}
