[swift] Swift에서 PopupDialog를 사용하여 날씨 정보 표시 팝업창 만들기
이번 예제에서는 Swift에서 PopupDialog를 사용하여 날씨 정보를 표시하는 팝업창을 만드는 방법에 대해 알아보겠습니다. PopupDialog는 사용자 경험을 향상시키기 위해 팝업 형태의 다이얼로그를 제공하는 라이브러리입니다.
팝업창 디자인 준비하기
먼저, 팝업창의 디자인을 준비해야 합니다. 이미지, 텍스트, 버튼 등을 포함할 수 있습니다. 이 예제에서는 날씨 아이콘, 날씨 상태, 온도 정보를 표시하는 팝업창을 만들어보겠습니다.
let title = "날씨 정보"
let message = "오늘의 날씨 상태: 흐림\n현재 온도: 25도"
// 팝업창 디자인을 위한 컨텐츠 뷰 생성
let weatherView = WeatherView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
weatherView.iconImageView.image = UIImage(named: "cloudy")
weatherView.descLabel.text = message
// PopupDialog 생성
let popup = PopupDialog(title: title, message: nil)
popup.addButtons([
DefaultButton(title: "확인") {}
])
// 팝업창에 컨텐츠 뷰 추가
popup.addContentView(weatherView)
// 팝업창 표시
self.present(popup, animated: true, completion: nil)
위 코드에서는 먼저 title과 message 변수에 팝업창에 표시될 제목과 메시지를 저장합니다. 이어서 WeatherView라는 사용자 정의 뷰를 생성하고, 날씨 아이콘과 온도 정보를 설정합니다. 그리고 PopupDialog 객체를 생성하고, 확인 버튼을 추가합니다. 마지막으로, 팝업창에 컨텐츠 뷰를 추가하고, 화면에 표시합니다.
WeatherView 클래스 만들기
위 코드에서 사용되는 WeatherView는 날씨 아이콘과 온도 정보를 표시하기 위한 사용자 정의 뷰입니다. 이 뷰를 아래와 같이 구현해보겠습니다.
import UIKit
class WeatherView: UIView {
let iconImageView: UIImageView
let descLabel: UILabel
override init(frame: CGRect) {
super.init(frame: frame)
// 아이콘 이미지 초기화
iconImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: frame.width, height: frame.height - 30))
iconImageView.contentMode = .scaleAspectFit
addSubview(iconImageView)
// 날씨 상태 텍스트 초기화
descLabel = UILabel(frame: CGRect(x: 0, y: frame.height - 30, width: frame.width, height: 30))
descLabel.textAlignment = .center
addSubview(descLabel)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
WeatherView는 UIView를 상속받고, iconImageView와 descLabel을 멤버 변수로 가집니다. init(frame:) 메서드에서 이들을 초기화하고, 뷰에 추가합니다.