[iOS] 기본 AlertView 사용하기 1

안녕하세요! 아이폰을 사용하다보면 아래와 같은 팝업창 많이 보실텐데요!

오늘은 iOS UIAlertController를 사용해서 AlertView를 띄우는 방법을 알아보겠습니다.

---

1. Alert View 구성 요소

---

2. Alert View 만드는 순서

구성요소를 알아봤으니 Xcode 프로젝트를 생성하고 직접 Alert View를 띄워봅시다!

우선 간단하게 스토리보드에 버튼을 누르면 Alert View를 띄울 수 있도록 버튼의 IBAction 안에 코드를 짜보도록 하겠습니다.

① AlertController

AlertController에서 지정할 부분은 여기입니다

Alert의 구성요소는 다음과 같습니다

• Title: alert의 제목

• Message: alert에 대한 자세한 내용을 제공하는 설명 텍스트

• preferredStyle: alert 컨트롤러의 스타일 - alert, action sheet 두 종료가 있는데 오늘 사용할 스타일은 alert입니다

각 구성요소에 맞는 값을 차례로 넣어주면 됩니다. 참고로 title은 볼드, message는 기본 서체가 들어갑니다

        let alert = UIAlertController(title: "타이틀입니다", message: "메세지입니다", preferredStyle: .alert)

혹시 title이나 message 둘 중 하나만 이용하고 싶다면, 쓰지 않을 구성요소의 값을 ""으로 넣어주면 되겠죠?

// title만 쓰고 싶을 때
let alert = UIAlertController(title: "타이틀입니다", message: "", preferredStyle: .alert)

// message만 쓰고 싶을 때
let alert = UIAlertController(title: "", message: "메세지입니다", preferredStyle: .alert)

---

② Alert Action

Alert Action에서 지정할 부분은 여기입니다!

        let action = UIAlertAction(title: "action", style: .default, handler: nil)

UIAlertAction의 스타일에는 default, cancel, destructive 3가지가 있는데요! 하나씩 비교해볼게요

default에 비해 cancel은 볼드 스타일로, destructive는 빨간색으로 바뀐 것을 확인할 수 있습니다. 목적에 맞게 사용하시면 됩니다

---

③ add Action

이제 잘 만든 action을 alert에 붙여줘야겠죠? addAction() 함수를 이용하면 간단하게 붙일 수 있습니다!

/* 참고용 */
// addAction Declaration
func addAction(_ action: UIAlertAction)

alert.addAction(action)

---

④ present

이제 action이 붙은 alert view가 완성됐으니까 present해주면 됩니다!

present(alert, animated: true, completion: nil)

---

다음 포스팅에서는 이어서 UIAlertAction의 handler와 present의 completion을 사용해보겠습니다!

전체코드입니다 :)

//
//  ViewController.swift
//  AlertView
//
//  Created by 장서현 on 2021/02/21.
//

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func showAlertView(_ sender: Any) {
        // 1. alert view 만들기
        let alert = UIAlertController(title: "타이틀입니다", message: "메세지입니다", preferredStyle: .alert)

        // 2. alert action 만들기
        let action = UIAlertAction(title: "확인", style: .default, handler: nil)

        // 3. alert에 action 붙이기
        alert.addAction(action)

        // 4. alert present하기
        present(alert, animated: true, completion: nil)
    }
}