UIDatePicker 在 iOS14 上的新特性

iOS 9 到 iOS13.4，UIDatePicker 的樣式如圖

UIDatePicker

如果你的 UI 在 iOS14 上出現(xiàn)了問題偶摔，想修改回以前暇唾，可以設置 UIDatePicker 的
preferredDatePickerStyle 屬性

不同的顯示方式可能導致 UI 出現(xiàn)問題

if #available(iOS 13.4, *) {
    preferredDatePickerStyle = .wheels
}

這個新樣式是蘋果UIDatePicker 的更新，提供一個可供用戶點擊的更小 UI

@available(iOS 13.4, *)
public enum UIDatePickerStyle : Int {

    
    /// Automatically pick the best style available for the current platform & mode.
    case automatic = 0

    /// Use the wheels (UIPickerView) style. Editing occurs inline.
    case wheels = 1

    /// Use a compact style for the date picker. Editing occurs in an overlay.
    case compact = 2

    /// Use a style for the date picker that allows editing in place.
    @available(iOS 14.0, *)
    case inline = 3
}

preferredDatePickerStyle

實驗一下每個值的具體樣式：

let picker = UIDatePicker()
view.addSubview(picker)
        
picker.datePickerMode = .date
picker.locale = Locale.init(identifier: "zh_CN")

//        picker.frame =  CGRect(x: 0, y: 100, width: UIScreen.main.bounds.width, height: 300)
picker.center = view.center
picker.preferredDatePickerStyle = .automatic // 修改這個值觀察變化

將 preferredDatePickerStyle 設置為:
.automatic：swift 會自動選出合適的樣式
.wheels：如前文所提到的辰斋，顯示經典樣式
.compact：可點的小 UI策州，點按后彈出系統(tǒng)時間選擇控件（這是在一個 alert 中）
.inline：直接顯示時間選擇控件（在當前 UI）

.automatic

.wheels

.compact

. inline

關于 UIDatePicker 的 preferredDatePickerStyle，我比較感興趣的是它的 .compact宫仗，嘗試改變其樣式够挂，可以直接用在項目里，但灰色的背景不可以通過設置 backgroundColor = .white 去實現(xiàn)藕夫，backgroundColor 設置成任意其它值孽糖，都可以起效枯冈，但設置成 .white 后始終還是有個灰色底，猜想蘋果留這個底的原因是提示用戶這個控件可按办悟。所以如果要直接使用尘奏，可以和設計商量一下，換一個合適自家 APP 的底色誉尖。

如果一定要設置成白色罪既，可以在 UIDatePicker 的最上層插入一個白色的 View，設置其大小與 superview 相等

// .compact 時 底色顯示為白色
picker.subviews.first?.subviews.forEach { grayView in
    let view = UIView(frame: grayView.bounds)
    view.translatesAutoresizingMaskIntoConstraints = false
    view.backgroundColor = .white
    grayView.insertSubview(view, at: 0)
    view.topAnchor.constraint(equalTo: grayView.safeAreaLayoutGuide.topAnchor).isActive = true
    view.bottomAnchor.constraint(equalTo: grayView.safeAreaLayoutGuide.bottomAnchor).isActive = true
    view.leadingAnchor.constraint(equalTo: grayView.safeAreaLayoutGuide.leadingAnchor).isActive = true
    view.trailingAnchor.constraint(equalTo: grayView.safeAreaLayoutGuide.trailingAnchor).isActive = true
}

將 preferredDatePickerStyle 設置為 .compact時铡恕，字色修改要用 tintColor 而非textColor

picker.tintColor = .black // 字色為黑色

但如上文所說琢感，底色為白色+背景色也是白色時，不易發(fā)現(xiàn)這是一個可點按的控件探熔。

白底黑字

最后編輯于：2020.11.02 16:54:51

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者