在Swift中的弹出式datePickerView中添加一个“完成”按钮？

Question

我想在Swift中弹出的datePickerView中添加一个“完成”按钮。

以下是代码：

@IBOutlet var datePicker: UITextField!

@IBAction func dateTextInputPressed(sender: UITextField) {

    var datePickerView = UIDatePicker()
    datePickerView.datePickerMode = UIDatePickerMode.Date

    sender.inputView = datePickerView
    datePickerView.addTarget(self, action: Selector("handleDatePicker:"), forControlEvents: UIControlEvents.ValueChanged)
}

func handleDatePicker(sender: UIDatePicker) {
    var dateFormatter = NSDateFormatter()
    dateFormatter.dateFormat = "yyyy-MM-dd"
    datePicker.text = dateFormatter.stringFromDate(sender.date)
}

我可以成功地使用这段代码弹出一个日期选择器。

但是在我选择日期后，它没有一个“完成”按钮来关闭它。

那么我该如何在其中添加“完成”按钮呢？

- He Yifei 何一非

---

在Swift 5中 https://dev59.com/EF8d5IYBdhLWcg3wNQNg#58023152 - Naresh

Answer 1

我制作了这个扩展程序来关闭选择器。Swift 2

extension UIToolbar {

 func ToolbarPiker(mySelect : Selector) -> UIToolbar {

    let toolBar = UIToolbar()

    toolBar.barStyle = UIBarStyle.Default
    toolBar.translucent = true
    toolBar.tintColor = UIColor.blackColor()
    toolBar.sizeToFit()

    let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.Plain, target: self, action: mySelect)
    let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FlexibleSpace, target: nil, action: nil)

    toolBar.setItems([ spaceButton, doneButton], animated: false)
    toolBar.userInteractionEnabled = true

    return toolBar
}

}

Swift 3 - 4

extension UIToolbar {

func ToolbarPiker(mySelect : Selector) -> UIToolbar {

    let toolBar = UIToolbar()

    toolBar.barStyle = UIBarStyle.default
    toolBar.isTranslucent = true
    toolBar.tintColor = UIColor.black
    toolBar.sizeToFit()

    let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.plain, target: self, action: mySelect)
    let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)

    toolBar.setItems([ spaceButton, doneButton], animated: false)
    toolBar.isUserInteractionEnabled = true

    return toolBar
}

}

您可以轻松地在您的视图控制器中使用它：

  override func viewDidLoad() {
    super.viewDidLoad()

 //SWIFT2
 /*
let toolBar = UIToolbar().ToolbarPiker(#selector(MyViewController.dismissPicker))

 */
// Swift3 - 4
    let toolBar = UIToolbar().ToolbarPiker(mySelect: #selector(MyViewController.dismissPicker))

    myTextField.inputAccessoryView = toolBar


}

 // Swift 2 - 3
 func dismissPicker() { 

    view.endEditing(true)

}

 // Swift 4
 @objc func dismissPicker() { 

    view.endEditing(true)

}

- Rob

---

优秀的解决方案。有关 swift 3 代码的一个小修改：let toolBar = UIToolbar().ToolbarPiker(mySelect: #selector - Night Warrier

在你想要的地方，例如UITextField（myTextField）的Editing Did Begin函数内，将myTextField.inputView = myPikerView添加到before code之后的代码中。 - Rob

我想在按钮轻触后显示选择器，并在从Picker中选择后将其分配给按钮标题。因此，inputAccessoryView对UIButton无效。还有其他解决方案吗？ - Jayprakash Dubey

Answer 2

你可以使用一个通用的UIView作为UITextField的inputView属性。我们可以将UIDatePicker和UIButton添加到这个UIView中。

@IBAction func dateTextInputPressed(sender: UITextField) {

    //Create the view
    let inputView = UIView(frame: CGRectMake(0, 0, self.view.frame.width, 240))


    var datePickerView  : UIDatePicker = UIDatePicker(frame: CGRectMake(0, 40, 0, 0))
    datePickerView.datePickerMode = UIDatePickerMode.Date
    inputView.addSubview(datePickerView) // add date picker to UIView

    let doneButton = UIButton(frame: CGRectMake((self.view.frame.size.width/2) - (100/2), 0, 100, 50))
    doneButton.setTitle("Done", forState: UIControlState.Normal)
    doneButton.setTitle("Done", forState: UIControlState.Highlighted)
    doneButton.setTitleColor(UIColor.blackColor(), forState: UIControlState.Normal)
    doneButton.setTitleColor(UIColor.grayColor(), forState: UIControlState.Highlighted)

    inputView.addSubview(doneButton) // add Button to UIView

    doneButton.addTarget(self, action: "doneButton:", forControlEvents: UIControlEvents.TouchUpInside) // set button click event

    sender.inputView = inputView
    datePickerView.addTarget(self, action: Selector("handleDatePicker:"), forControlEvents: UIControlEvents.ValueChanged)

    handleDatePicker(datePickerView) // Set the date on start.
}

func handleDatePicker(sender: UIDatePicker) {
    var dateFormatter = NSDateFormatter()
    dateFormatter.dateFormat = "yyyy-MM-dd"
    datePicker.text = dateFormatter.stringFromDate(sender.date)
}

func doneButton(sender:UIButton)
{
    datePicker.resignFirstResponder() // To resign the inputView on clicking done.
}

- rakeshbs

Answer 3

如果您使用按钮而不是文本字段：

/** * MARK - 预订行动 */

@IBAction func advanceBookingAction(sender: UIButton) {

    var datePicker : UIDatePicker = UIDatePicker()
    var datePickerContainer = UIView()

    datePickerContainer.frame = CGRectMake(0.0, self.view.frame.height/2, 320.0, 300.0)
    datePickerContainer.backgroundColor = UIColor.whiteColor()

    var pickerSize : CGSize = datePicker.sizeThatFits(CGSizeZero)
    datePicker.frame = CGRectMake(0.0, 20, pickerSize.width, 460)
    datePicker.setDate(NSDate(), animated: true)
    datePicker.maximumDate = NSDate()
    datePicker.datePickerMode = UIDatePickerMode.DateAndTime
    datePicker.addTarget(self, action: "dateChangedInDate:", forControlEvents: UIControlEvents.ValueChanged)
    datePickerContainer.addSubview(datePicker)

    var doneButton = UIButton()
    doneButton.setTitle("Done", forState: UIControlState.Normal)
    doneButton.setTitleColor(UIColor.blueColor(), forState: UIControlState.Normal)
    doneButton.addTarget(self, action: Selector("dismissPicker:"), forControlEvents: UIControlEvents.TouchUpInside)
    doneButton.frame    = CGRectMake(250.0, 5.0, 70.0, 37.0)

    datePickerContainer.addSubview(doneButton)

    self.view.addSubview(datePickerContainer)

}// end advanceBookingAction

/**
* MARK - observer to get the change in date
*/

func dateChangedInDate(sender:UIDatePicker){

    var dateFormatter = NSDateFormatter()
    dateFormatter.dateStyle = NSDateFormatterStyle.LongStyle
    dateFormatter.timeStyle = NSDateFormatterStyle.NoStyle
    objMethodInc.printvj("date selected \(datePicker.date)")

}// end dateChangedInDate

/*
* MARK - dismiss the date picker value
*/
func dismissPicker(sender: UIButton) {
    objMethodInc.printvj("dismiss date picker")
    datePickerContainer.removeFromSuperview()
}// end dismissPicker

- Vinod Joshi

Answer 4

@IBOutlet weak var txtDate: UITextField!
override func viewDidLoad() {
    super.viewDidLoad()
    
    //Write toolbar code for done button
    let toolBar = UIToolbar()
    toolBar.barStyle = .default
    toolBar.isTranslucent = true
    let space = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
    let doneButton = UIBarButtonItem(title: "Done", style: .done, target: self, action: #selector(onClickDoneButton))
    toolBar.setItems([space, doneButton], animated: false)
    toolBar.isUserInteractionEnabled = true
    toolBar.sizeToFit()
    txtDate.inputAccessoryView = toolBar //Change your TextField name here
    
    let datePickerView = UIDatePicker()
    datePickerView.datePickerMode = UIDatePicker.Mode.date
    
    txtDate.inputView = datePickerView
    datePickerView.addTarget(self, action: #selector(handleDatePicker(sender:)), for: UIControl.Event.valueChanged)
    
}

@objc func onClickDoneButton() {
    self.view.endEditing(true)
}

@objc func handleDatePicker(sender: UIDatePicker) {
    let dateFormatter = DateFormatter()
    dateFormatter.dateFormat = "yyyy-MM-dd"
    txtDate.text = dateFormatter.string(from: sender.date)
}

- Hemanshu Liya

---

将上述答案综合起来，适用于Swift 5。 - Hemanshu Liya

Answer 5

在Swift 5中，如果您只想要DatePicker上的“完成”按钮，请使用我的代码。

//Write toolbar code for done button
let toolBar = UIToolbar()
toolBar.barStyle = .default
toolBar.isTranslucent = true
let space = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
let doneButton = UIBarButtonItem(title: "Done", style: .done, target: self, action: #selector(onClickDoneButton))
toolBar.setItems([space, doneButton], animated: false)
toolBar.isUserInteractionEnabled = true
toolBar.sizeToFit()
dobTF.inputAccessoryView = toolBar //Change your TextField name here

@objc func onClickDoneButton() {
    self.view.endEditing(true)
}

- Naresh