[UIKit] CustomDatePicker 만들기 (2/3)

 

 

CustomPickerButton을 만들었으니 DatePicker로 진화해보자

 

알다시피 나는

이걸 만들기로 했다

 

📌 UI setting

별거 없다.. 그냥 ㄹㅇ UI setting code

open class CustomDatePicker: UIView{
    
    private var Titlelabel = UILabel()
    
    private var years = [String]()
    private var months = [String]()
    private var days = [String]()
    
    private let yearWidth : CGFloat = 126
    private let monthWidth : CGFloat = 103
    private let dayWidth : CGFloat = 103
    
    private lazy var yearPicker = CustomPickerButton(placeholder: "YYYY", width: yearWidth, data: years)
    private lazy var monthPicker = CustomPickerButton(placeholder: "MM", width: monthWidth, data: months)
    private lazy var dayPicker = CustomPickerButton(placeholder: "DD", width: dayWidth, data: days)
    
    func initAttribute(title: String){
        Titlelabel = {
            let label = UILabel()
            label.textColor = .black
            label.font = .systemFont(ofSize: 17)
            label.text = title
            return label
        }()
    
    }
    
    func initAutolayout(){
        [Titlelabel, yearPicker, monthPicker, dayPicker].forEach {
            self.addSubview($0)
        }
        
        self.addSubview(yearPicker)

        Titlelabel.snp.makeConstraints {
            $0.left.equalToSuperview()
            $0.top.equalToSuperview()
        }

        yearPicker.snp.makeConstraints {
            $0.left.equalToSuperview()
            $0.top.equalTo(Titlelabel.snp.bottom).offset(4)
            $0.bottom.equalToSuperview()
        }

        monthPicker.snp.makeConstraints {
            $0.left.equalTo(yearPicker.snp.right).offset(8)
            $0.top.equalTo(yearPicker)
            $0.bottom.equalToSuperview()
        }

        dayPicker.snp.makeConstraints {
            $0.left.equalTo(monthPicker.snp.right).offset(8)
            $0.top.equalTo(yearPicker)
            $0.bottom.equalToSuperview()
            $0.right.equalToSuperview()
        }

    }
    
}

 

주의해야 할 점은 autolayout !!!

view의 크기나 위치가 정확하지 않으면 UIButton 동작 안하기 때문에 위치랑 크기 설정 잘 해주시길,,

 

 

📌 date setting

나는 DatePicker를 만들거니까 년, 월, 일을 호출해야 한다.

근데 일단.. 아직 2편이니까 일은 정확한 설정을 생략하고.. 년, 월만 설정해보겠음 ㅎㅎ

 

func dataSetting(){

    // 1970 ~ 현재 년도 까지
    for y in 1970...dateFormatter("yyyy") {
        years.append(String(y))
    }
    
    // default : 1 ~ 12
    for m in 1...12{
        months.append(String(m))
    }
    
    // not yet..
    for d in 1...31{
        days.append(String(d))
    }
}

func dateFormatter(_ format : String) -> Int {
    let formatter_year = DateFormatter()
    formatter_year.dateFormat = format
    let string_data = formatter_year.string(from: Date())
    return Int(string_data)!
}

 

년도의 끝은 dateFormatter를 이용해서 현재 년도를 가지고 오게 해줬음 !!

 

 

 

사실 요롷게 하면 CustomDatePicker 보여주기식 구현은 끝임..

이제 일을 조작해야 하는데 아마도 Observer를 써야 할것 같음!!

그래서 마지막 3에서 아주 자세히 다뤄보도록 하겠습니다..😅