iOS/UIKit

[UIKit] ActionSheet에 Date Picker 넣기

하노 Hano 2022. 10. 3. 20:23

안녕하세요 하노입니다 :)

오늘은 ActionSheet에 Date Picker 넣는 법을 알아보겠습니다.

 


 

1. ActionSheet를 띄워줄 버튼을 생성하고 ViewController와 연결해줍니다.

 

저는 간단하게 가운데에 넣어서 만들고 오토 레이아웃으로 정 가운데 배치하겠습니다.

 

 

 

 

 

2.  버튼을 클릭하면 Alert을 ActionSheet로 생성합니다.

 

let alert = UIAlertController(title: "날짜 고르기", message: "날짜를 골라주세요", preferredStyle: .actionSheet)
let ok = UIAlertAction(title: "선택 완료", style: .cancel, handler: nil)
        
alert.addAction(ok)
        
present(alert, animated: true)

 

 

그러고 나서 빌드해보면

 

이런 식으로 동작이 되는 것을 확인할 수 있습니다.

 

이제 여기에 Date Picker를 넣어보겠습니다.

 

 

 

 

 

3. Date Picker를 생성합니다.

 

let alert = UIAlertController(title: "날짜 고르기", message: "날짜를 골라주세요", preferredStyle: .actionSheet)
let ok = UIAlertAction(title: "선택 완료", style: .cancel, handler: nil)
        
let datePicker = UIDatePicker()
datePicker.datePickerMode = .date
datePicker.preferredDatePickerStyle = .wheels
datePicker.locale = Locale(identifier: "ko_KR")
        
alert.addAction(ok)
        
present(alert, animated: true)

 

 

4. Date Picker를 ActionSheet에 넣어줍니다.

 

let alert = UIAlertController(title: "날짜 고르기", message: "날짜를 골라주세요", preferredStyle: .actionSheet)
let ok = UIAlertAction(title: "선택 완료", style: .cancel, handler: nil)
        
let datePicker = UIDatePicker()
datePicker.datePickerMode = .date
datePicker.preferredDatePickerStyle = .wheels
datePicker.locale = Locale(identifier: "ko_KR")
        
alert.addAction(ok)
        
let vc = UIViewController()
vc.view = datePicker
        
alert.setValue(vc, forKey: "contentViewController")
        
present(alert, animated: true)

 

여기서 alert의 setValue 부분에서 "contentviewController"가 아닌 다른 값을 넣으면 동작이 되지 않으니 꼭 이 값을 넣어주세요!

 

 

 

이제 한번 빌드해서 확인해보겠습니다.

 

 

 

보시는 것 처럼 actionSheet 내 DatePicker가 잘 동작하는 것을 확인해볼 수 있습니다.

 

마지막으로 DatePicker에 바뀐 값을 버튼 Title에 넣어주겠습니다.

 

 

let alert = UIAlertController(title: "날짜 고르기", message: "날짜를 골라주세요", preferredStyle: .actionSheet)
let datePicker = UIDatePicker()
datePicker.datePickerMode = .date
datePicker.preferredDatePickerStyle = .wheels
datePicker.locale = Locale(identifier: "ko_KR")
        
let ok = UIAlertAction(title: "선택 완료", style: .cancel) { action in
	self.dateButton.setTitle("\(datePicker.date)", for: .normal)
}    
                
alert.addAction(ok)
        
let vc = UIViewController()
vc.view = datePicker
        
alert.setValue(vc, forKey: "contentViewController")
        
present(alert, animated: true)

 

 

위 코드를 넣고 빌드해서 확인해보면

위와 같이 동작하는 것을 확인할 수 있습니다.

 

 


 

 

오늘은 ActionSheet 내 DatePicker를 넣어보는 방법을 알아보았습니다.

 

사실 앱을 출시하면서 위와 같은 방법이 있는지 확인해보다가 자료를 찾기 어려웠습니다 ㅠㅠ

그래서 꼭 출시 후 글로 정리를 해봐야겠다는 생각에 작성하게 됐네요 ㅎㅎ

 

그럼 오늘 글은 여기서 마치겠습니다 :D