UIPickerView Example With UIToolbar in Swift 3.0.

UIPickerView is a wheel type machine mechanism in which you are take one or more sets of value. There are one selection indicator where value is selected by user. In this example we are create UIPickerView example with UIToolbar in swift 3 programmatically.

In this example, take one textFiled in which to open the pickerView using inputView. and adding toolbar on pickerView programmatically.

Follow the below steps :

Step 1 :  Adding one textFiled named  txt_pickUpData in ViewController and give IBOutlet connection and delegate. also take one UIDatePicker variable. and take an Array with string value which is display on picker wheel.

@IBOutlet weak var txt_pickUpData: UITextField!
var myPickerView : UIPickerView!
var pickerData = ["Hitesh Modi" , "Kirit Modi" , "Ganesh Modi" , "Paresh Modi"]

Step 2 :  Also adding the delegate of UIPickerView and UITextFiled.

class ViewController: UIViewController , UIPickerViewDelegate, UIPickerViewDataSource, UITextFieldDelegate{

Step 3 : The function pickUp to create UIPickerView with ToolBar. 

func pickUp(_ textField : UITextField){

    // UIPickerView
    self.myPickerView = UIPickerView(frame:CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: 216))
    self.myPickerView.delegate = self
    self.myPickerView.dataSource = self
    self.myPickerView.backgroundColor = UIColor.white
    textField.inputView = self.myPickerView

    // ToolBar
    let toolBar = UIToolbar()
    toolBar.barStyle = .default
    toolBar.isTranslucent = true
    toolBar.tintColor = UIColor(red: 92/255, green: 216/255, blue: 255/255, alpha: 1)
    toolBar.sizeToFit()

    // Adding Button ToolBar
    let doneButton = UIBarButtonItem(title: "Done", style: .plain, target: self, action: #selector(ViewController.doneClick))
    let spaceButton = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
    let cancelButton = UIBarButtonItem(title: "Cancel", style: .plain, target: self, action: #selector(ViewController.cancelClick))
    toolBar.setItems([cancelButton, spaceButton, doneButton], animated: false)
    toolBar.isUserInteractionEnabled = true
    textField.inputAccessoryView = toolBar

}

Step 4 : Adding the delegate and datasource methods of UIPickerView to display data on UIPickerView wheel.

//MARK:- PickerView Delegate & DataSource
func numberOfComponents(in pickerView: UIPickerView) -> Int {
    return 1
}
func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    return pickerData.count
}
func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    return pickerData[row]
}
func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    self.txt_pickUpData.text = pickerData[row]
}
//MARK:- TextFiled Delegate

func textFieldDidBeginEditing(_ textField: UITextField) {
    self.pickUp(txt_pickUpData)
}

Step 5 : Adding two buttons method which which is in ToolBar. One is doneClick and other is cancelClick. Which is dismiss the UIPickerView.

//MARK:- Button
  func doneClick() {
      txt_pickUpData.resignFirstResponder()
  }
  func cancelClick() {
      txt_pickUpData.resignFirstResponder()
  }

Step 6 : Calling the pickUp function in UITextField delegate method.

func textFieldDidBeginEditing(_ textField: UITextField) {
    self.pickUp(txt_pickUpData)
}

Step 7 : outPut UIPickerView with ToolBar in UITextField.

                               


Step 8 : Demo

Thanks.