UIDatePicker工具栏,但没有文本字段

2022-01-28 16:21:36 标签 iosswiftuidatepicker

在我的应用程序中,我有一个按钮,当点击时应该显示时间选择工具栏上。我看到的大多数例子添加工具栏作为一个inputAccessoryView的文本字段,但在我的情况下,我没有一个文本字段。

我创建了一个自定义视图,它有日期时间选择器和工具栏,我把那个视图作为子视图添加到控制器的视图,但我没有在应用程序上看到这个自定义视图。

下面是按钮点击的控制器代码:

func buttonClicked(date: Date) {
    let timePicker = EditTimeHelper.createTimePickerAndToolbar(displayDate: date)
    self.view.addSubview(timePicker)
}

在单独的EditTimeHelper类中定制视图的代码:

  static func createTimePickerAndToolbar(displayDate: Date) -> UIView {
        let pickerView = UIView(frame: CGRect(x: 0, y: UIScreen.main.bounds.height - 300, width: UIScreen.main.bounds.width, height: 300))
        let timePicker = createTimePicker(displayDate: displayDate)
        pickerView.addSubview(timePicker)
        let toolbar = createUIToolBar()
        pickerView.addSubview(toolbar)
        return pickerView
    }
    
    static func createTimePicker(displayDate: Date) -> UIDatePicker {
        let timePicker:UIDatePicker = UIDatePicker()
        timePicker.datePickerMode = UIDatePicker.Mode.time
        timePicker.date = displayDate
        timePicker.minuteInterval = 15
        if #available(iOS 13.4, *) {
            timePicker.preferredDatePickerStyle = .wheels
        } else {
            // Fallback on earlier versions where time picker is wheels style by default.
        }
        timePicker.addTarget(self, action: #selector(timeChanged(_:)), for: UIControl.Event.valueChanged)
        timePicker.backgroundColor = .white
        timePicker.frame = CGRect(x: 0, y: UIScreen.main.bounds.height - 200, width: UIScreen.main.bounds.width, height: 200)
        return timePicker
    }
    
    private static func createUIToolBar() -> UIToolbar {
        let pickerToolbar = UIToolbar()
        pickerToolbar.autoresizingMask = .flexibleHeight
        
        //customize the toolbar
        pickerToolbar.barStyle = .default
        pickerToolbar.barTintColor = UIColor.black
        pickerToolbar.backgroundColor = UIColor.white
        pickerToolbar.isTranslucent = false
        
        pickerToolbar.frame = CGRect(x: 0, y: UIScreen.main.bounds.height - 300, width: UIScreen.main.bounds.width, height: 100)
        // add buttons
        let cancelButton = UIBarButtonItem(barButtonSystemItem: .cancel, target: self, action: #selector(cancelBtnClicked(_:)))
        cancelButton.tintColor = UIColor.white
        let flexSpace = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
        let doneButton = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(doneBtnClicked(_:)))
        doneButton.tintColor = UIColor.white
        
        //add the items to the toolbar
        pickerToolbar.items = [cancelButton, flexSpace, doneButton]
        return pickerToolbar
    }
    
    @objc func timeChanged(_ sender: UIDatePicker) {
       
    }
    
    @objc func cancelBtnClicked(_ button: UIBarButtonItem?) {
        
    }
    
    @objc func doneBtnClicked(_ button: UIBarButtonItem?) {
        
    }

有什么想法我做错了,没有看到自定义视图?

如果我调用EditTimeHelper。createTimePicker(displatDate: date),然后我看到时间选择器,但我想在它的顶部添加工具栏。

当我调试这段代码时,我看到时间选择器和工具栏作为自定义视图的子视图,但我只是没有在应用程序上看到它们。

你看不到时间选择器和工具栏的原因是因为你把时间选择器和工具栏定位错了。注意这两行:

timePicker.frame = CGRect(x: 0, y: UIScreen.main.bounds.height - 200, width: UIScreen.main.bounds.width, height: 200)
// and
pickerToolbar.frame = CGRect(x: 0, y: UIScreen.main.bounds.height - 300, width: UIScreen.main.bounds.width, height: 100)

因为这些是pickerView的子视图,坐标相对于pickerView的左上角,而不是屏幕的左上角。你应该这样做

timePicker.frame = CGRect(x: 0, y: 100, width: UIScreen.main.bounds.width, height: 200)
// and
pickerToolbar.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 100)

现在你应该看到工具栏和时间选择器。

然而,您的代码还有其他问题。第一次改变cancelBtnClicked和doneBtnClicked不会被调用。您已经添加了self作为工具栏按钮项和选择器的目标,但是由于您是在一个静态方法中,self引用类本身。当用户按下done按钮时,它将尝试在类上调用一个名为doneBtnClicked的方法,而不是一个特定的实例。但是类没有这样的方法!您声明的doneBtnClicked是一个仅在实例上可用的实例方法。

其次,你给这些视图固定的位置。这意味着当用户旋转屏幕时,布局看起来会非常奇怪。只使用自动布局!

你也可以让timeechanged cancelBtnClicked和doneBtnClicked都是静态的但更好的方法是创建一个自定义UIView子类。下面是一个例子作为起点:

class TimePickerToolBarView: UIView {
    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        commonInit()
    }
    
    private func commonInit() {
        let timePicker = createTimePicker()
        addSubview(timePicker)
        let toolBar = createUIToolBar()
        addSubview(toolBar)
        timePicker.translatesAutoresizingMaskIntoConstraints = false
        toolBar.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            toolBar.heightAnchor.constraint(equalToConstant: 44),
            toolBar.topAnchor.constraint(equalTo: topAnchor),
            toolBar.leftAnchor.constraint(equalTo: leftAnchor),
            toolBar.rightAnchor.constraint(equalTo: rightAnchor),
            timePicker.leftAnchor.constraint(equalTo: leftAnchor),
            timePicker.rightAnchor.constraint(equalTo: rightAnchor),
            timePicker.bottomAnchor.constraint(equalTo: bottomAnchor),
            timePicker.topAnchor.constraint(equalTo: toolBar.bottomAnchor),
        ])
    }
    
    private func createTimePicker() -> UIDatePicker {
        let timePicker:UIDatePicker = UIDatePicker(frame: .zero)
        timePicker.datePickerMode = UIDatePicker.Mode.time
        timePicker.minuteInterval = 15
        if #available(iOS 13.4, *) {
            timePicker.preferredDatePickerStyle = .wheels
        } else {
            // Fallback on earlier versions where time picker is wheels style by default.
        }
        timePicker.addTarget(self, action: #selector(timeChanged(_:)), for: UIControl.Event.valueChanged)
        timePicker.backgroundColor = .white
        return timePicker
    }
    
    private func createUIToolBar() -> UIToolbar {
        let pickerToolbar = UIToolbar(frame: .zero)
        
        //customize the toolbar
        pickerToolbar.barStyle = .default
        pickerToolbar.barTintColor = UIColor.black
        pickerToolbar.backgroundColor = UIColor.white
        pickerToolbar.isTranslucent = false
        // add buttons
        let cancelButton = UIBarButtonItem(barButtonSystemItem: .cancel, target: self, action: #selector(cancelBtnClicked(_:)))
        cancelButton.tintColor = UIColor.white
        let flexSpace = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
        let doneButton = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(doneBtnClicked(_:)))
        doneButton.tintColor = UIColor.white
        
        //add the items to the toolbar
        pickerToolbar.items = [cancelButton, flexSpace, doneButton]
        return pickerToolbar
    }
    
    @objc func timeChanged(_ sender: UIDatePicker) {
       
    }
    
    @objc func cancelBtnClicked(_ button: UIBarButtonItem?) {
        
    }
    
    @objc func doneBtnClicked(_ button: UIBarButtonItem?) {
        
    }
}
阅读全文

▼ 版权说明

相关文章也很精彩
推荐内容
更多标签
相关热门
全站排行
随便看看

错说 cuoshuo.com —— 程序员的报错记录

部分内容根据CC版权协议转载;网站内容仅供参考,生产环境使用务必查阅官方文档

辽ICP备19011660号-5

×

扫码关注公众号:职场神器
发送: 1
获取永久解锁本站全部文章的验证码