[Swift] 뒤에 배경이 보이는 팝업창 띄우기

이번 포스팅에서는 기존에 포스팅했던 Alert와는 다른 팝업창을 띄우는 방법에 대해서 알아보겠습니다. 기본적으로 Alert Controller와 유사한 형태로 만들되, 내부를 커스텀하게 꾸밀 수 있는 방법입니다.

특정 버튼 시, 위와 같은 새로운 팝업뷰가 생성되며, 뒤로는 바로 이전 뷰가 연하게 보이는 형태입니다. 깔끔한 UI구성을 위해서 종종 사용하는 방법인데요.

크게 다음과 같이 진행합니다.

1. StoryBoard에서 팝업에 대한 ViewController를 생성하고, Swift파일도 생성하여 연결시켜줍니다.

2. StoryBoard에서 팝업뷰의 배경색을 검정색(또는 원하는 색상)으로 지정하고, Alpha값을 적당히 조절합니다. 이 때, 뷰 자체의 알파값이 아니라 배경색 속성에서의 알파값을 조절하시면 됩니다.

3. 팝업을 띄울 뷰에서 다음과 같이 콜백 이벤트를 구성합니다.

 

 

let storyBoard: UIStoryboard = UIStoryboard(name: "Main", bundle: nil)
let vc = storyBoard.instantiateViewController(withIdentifier: "popUpView") as! ViewControllerPopUp
vc.modalPresentationStyle = .overCurrentContext
self.present(vc, animated: true, completion: nil)

 

이렇게 되면, 뷰가 나타날 때 위 그림과 같이 뜨게 됩니다.