[Swift] UIDatePicker 달력

iOS 에서 제공하는 달력 UI 입니다.

 

달력스타일(Preferred Style) 은 Wheels, Compact, Inline 3종류가 있습니다.

참고로 Preferred Style 은 13.4에서부터 추가된 것이고, 13이하 버전에서는 Wheels 모양만 존재합니다.

Inline 은 14.0부터 지원합니다.

 

Wheels

Wheels 는 요렇게 생겼습니다. 아이폰에서 자주 보던 모양이죠.

 

 

Compact 

Compact 는 날짜만표시되는 버튼이 있고, 누르면 Inline스타일과 동일하게 생긴 달력이 나타납니다.

(빨간줄친 날짜영역을 터치)

 

그리고 년월 부분을 터치하면 Wheels 스타일의 달력이 나타납니다.

 

 

inline

inline이 제가 원하던 달력이었는데요(기본적인 달력모습)

 

코드를 살펴보겠습니다.

// Storyboard 에서 만든 DatePicker Outlet.
@IBOutlet weak var datePicker: UIDatePicker!

// inline 스타일은 14.0 이상지원.
if #available(iOS 14.0, *) {
    datePicker.preferredDatePickerStyle = .inline
}

// 달력에서 날짜변경됐을때 전달받을 함수지정.
datePicker.addTarget(self, action: #selector(handleDatePicker), for: .valueChanged)

// 날짜변경시 호출됨.
@objc func handleDatePicker(_ sender: UIDatePicker) {
    print(sender.date)
}

// 달력에 날짜를 지정하고 싶을때: 달력을 띄울때 오늘날짜로 지정하는 경우등..
datePicker.setDate(startDate, animated: true)

// 최대날짜지정: 예를들어 오늘이후의 날짜는 선택할 수 없게 하는 경우등..
datePicker.maximumDate = Date()

// 위와 반대되는 최소날짜도 있습니다.
let dateFormatter = DateFormatter()
dateFormatter.dateFormat = "yyyy-MM-dd"
datePicker.minimumDate = dateFormatter.date(from: "2010-01-01")!

 

스타일을 지정하고
  datePicker.preferredDatePickerStyle = .inline

 

달력을 띄울때 원하는 날짜 지정하고
  datePicker.setDate(startDate, animated: true)

최대날짜, 최소날짜 지정하고
  datePicker.maximumDate = Date()

  datePicker.minimumDate = Date()

달력에서 날짜변경시 전달받을 함수지정하고
  datePicker.addTarget(self, action: #selector(handleDatePicker), for: .valueChanged)

 

전달받은 날짜로 원하는 처리.
  @objc func handleDatePicker(_ sender: UIDatePicker) {
      print(sender.date)
  }

이정도 기능이면 왠만한 처리는 다 가능할 것 같습니다.

 

간편하고 디자인 괜찮은 달력을 구현하였습니다..... 만!!

문제가 있었으니.. 

 

달력부분에서 원하는 색상을 적용하려 했으나, 변경되는 부분은 밑줄친 세부분 뿐이었습니다.

이부분은 tintColor 를 지정하면 변경되지만 이마저도 세부분이 한꺼번에 적용됩니다.

 

날짜의 색상, 폰트, 폰트사이즈, 요일 등... 제가 찾아본 결과로는 바꿀수 있는 부분이 없었습니다.

순정으로도 만족할 수 있다면 문제가 없으나 다른 디자인 요청이 들어오는 순간 문제가 되는군요.

 

어쨋든 순정으로는 간편하고 훌륭한 기능을 제공하니 간단히 사용하면 될 것 같습니다.