[swift] 스토리보드에서 모달 및 팝오버 화면 표시하기

iOS 앱을 개발하다 보면 모달 또는 팝오버 형식으로 새로운 화면을 표시해야 하는 경우가 있습니다. 이때 스토리보드를 사용하여 간단하게 구현할 수 있습니다. 이 포스트에서는 모달 및 팝오버 화면을 스토리보드를 통해 표시하는 방법에 대해 알아보겠습니다.

모달 화면 표시하기

1. 모달 세그웨이 추가

먼저, 모달로 표시할 화면을 준비한 후에는 해당 화면과 화면을 호출할 버튼에 대해 각각의 View Controller를 추가합니다. 그리고 호출할 화면에 Present Modally 세그웨이를 추가합니다.

2. 세그웨이 식별자 지정

모달로 표시할 화면에 추가한 세그웨이에 대해 Attributes Inspector에서 식별자를 지정합니다.

3. 버튼과 액션 연결

모달로 표시할 화면을 호출할 버튼에 대해 Ctrl + 드래그로 액션을 추가하고, 액션 메서드 내부에서 performSegue(withIdentifier:sender:) 메서드를 사용하여 세그웨이를 실행합니다.

@IBAction func showModalScreen(_ sender: UIButton) {
    performSegue(withIdentifier: "YourSegueIdentifier", sender: self)
}

팝오버 화면 표시하기

1. 팝오버 세그웨이 추가

팝오버로 표시할 화면을 준비한 후에는 해당 화면과 화면을 호출할 버튼에 대해 각각의 View Controller를 추가합니다. 그리고 호출할 화면에 Present as Popover 세그웨이를 추가합니다.

2. 세그웨이 설정

팝오버로 표시할 화면에 추가한 세그웨이에 대해 Attributes Inspector에서 원하는 스타일 및 버튼을 지정합니다.

3. 버튼과 액션 연결

팝오버 화면을 호출할 버튼에 대해 Ctrl + 드래그로 액션을 추가하고, 액션 메서드 내부에서 present(_:animated:completion:) 메서드를 사용하여 세그웨이를 실행합니다.

@IBAction func showPopoverScreen(_ sender: UIButton) {
    if let popoverViewController = storyboard?.instantiateViewController(withIdentifier: "YourViewControllerIdentifier") {
        popoverViewController.modalPresentationStyle = .popover
        if let popoverPresentationController = popoverViewController.popoverPresentationController {
            popoverPresentationController.sourceView = sender
            popoverPresentationController.sourceRect = sender.bounds
            present(popoverViewController, animated: true, completion: nil)
        }
    }
}

이제 모달 및 팝오버 화면을 스토리보드를 통해 쉽게 표시할 수 있습니다. 필요에 따라 세부적인 설정을 추가하여 사용자 경험을 향상시킬 수 있습니다.

참고 자료