1

I am trying to hide my datepicker until my textField is selected. I did this simply for a pickerView I have. However, I have not been able to find a solution using Swift to show then hide the datePicker on a textField.

import UIKit

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource, UITextFieldDelegate {

@IBOutlet weak var TeeTimes: UILabel!
@IBOutlet weak var textFieldDate: UITextField!
@IBOutlet weak var datePicker: UIDatePicker!
@IBOutlet weak var picker: UIPickerView! = UIPickerView()
@IBOutlet weak var textfieldCourse: UITextField!


var pickerData = ["Norman Course", "Riding Golf", "Dmob Course"]

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    picker.hidden = true;
    self.textfieldCourse.delegate = self
    self.picker.delegate = self
    self.picker.dataSource = self
    textfieldCourse.text = pickerData[0]
    //Inputs the data into the array
    datePicker.hidden = true;
    datePicker.addTarget(self, action: Selector("datePickerChanged:"), forControlEvents: UIControlEvents.ValueChanged)

}
override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.

}
func numberOfComponentsInPickerView(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){
    textfieldCourse.text = pickerData[row]
    picker.hidden = true
}
func textFieldShouldBeginEditing(textfield: UITextField) ->Bool {
    picker.hidden = false
    return false
}
func datePickerChanged(dataPicker: UIDatePicker) {
    datePicker.hidden = false
    let dateFormatter = NSDateFormatter()
    dateFormatter.dateStyle = NSDateFormatterStyle.ShortStyle

    let strDate = dateFormatter.stringFromDate(datePicker.date)
    textFieldDate.text = strDate
}

}

Stepan Maksymov
  • 2,618
  • 19
  • 31
SwaggyMcMuffins
  • 27
  • 1
  • 1
  • 9

2 Answers2

1

I can't see why you wouldn't be able to use the same principle, seeing as both UIDatePicker and UIPickerView are subclasses of UIView. Simply set the delegate of textFieldDate to self and apply the same logic within textFieldShouldBeginEditing. Only you will have to check which text field is being edited in order to show the correct picker.

Additionally, you should set datePicker.hidden to true in your datePickerChanged function assuming you want the date picker to hide after a date has been selected.

Dennis G.
  • 283
  • 1
  • 11
  • Hi Dennis, if I have some more input fields below the date picker, is there a way to have it hide AND/OR collapse? Right now in viewDidLoad() I set datePicker.hidden = true but it just leaves the space empty. The fields below are not adjusted up to occupy that space. Thanks – rockhammer Jun 24 '16 at 22:59
  • 1
    Hi rockhammer, your issue seems to be with the way you set up your UI contraints. You should fiddle around in Auto Layout until you get the desired result. This should be a helpful reference: http://stackoverflow.com/questions/19561269/autolayout-with-hidden-uiviews – Dennis G. Jun 27 '16 at 20:44
  • Hi Dennis, thanks for the pointer. I was desperately trying to avoid the UITableView method of showing/hiding the datePicker. Your reference helped me figure out how to do it. Thanks – rockhammer Jun 28 '16 at 02:51
0

We can definitely use auto layout and set constraints to hide the space and collapse different views. You can set auto layout for different objects and set the height of date picker. Drag and drop the height constraint in your controller and provide a name:

enter image description here.

It will look something like this:

enter image description here

Next set the constraint to 0 in your viewDidLoad() like this: datePickerHeight.constant = 0

Now where you are hiding your datePicker set the height to 0 and when you are showing the datePicker set the height to the desired height. You can use:

if dateTimePicker.hidden {
    dateTimePicker.hidden = false
    datePickerHeight.constant = 135
} else {
    dateTimePicker.hidden = true
    datePickerHeight.constant = 0
}
koen
  • 5,383
  • 7
  • 50
  • 89
hacker_1989
  • 303
  • 4
  • 15