UIBarButtonItem not clickable in UIToolBar

Question

I have a UIPickerView and I am adding a UIToolBar with 2 UIBarButtonItems to it.

var toolBar = UIToolbar()
toolBar.frame.origin.y = -40
toolBar.barStyle = UIBarStyle.Default
toolBar.translucent = true
toolBar.tintColor = UIColor(red: 76/255, green: 217/255, blue: 100/255, alpha: 1)
toolBar.sizeToFit()


var doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.Bordered, target: self, action: "donePicker")
var spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FlexibleSpace, target: nil, action: nil)
var cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItemStyle.Bordered, target: self, action: "canclePicker")

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

pickerView.addSubview(toolBar)
pickerView.bringSubviewToFront(toolBar)
view.bringSubviewToFront(toolBar)

The problem is, that when I try to click on the the UIBarButtonItem, it doesn't fire, it doesn't even recognize it, it just clicks the cell beneath it.

Aidaaidan

The only reason I see is this toolBar.frame.origin.y = -40. The toolbar is outside of the pickerview's bound. – Steels

I tried it with y=0, and its the same, only that this time the pickerView beneath it is clicked... – Aidaaidan

did you try pickerView.inputAccessoryView = toolBar instead of adding it as a subview? – Steels

Yes that was my intention, but it doesnt even show the toolBar if I set the inputAccessoryView.. You mean textField.inputAccessoryView right ? Cant add accessoryView to pickerView – Aidaaidan

Sorry. not pickerView.inputAccessoryView. textField.inputView = pickerView textField.inputAccessoryView = toolBar – Steels

Yes, I tried, it doesnt show the toolBar. Anyway, how can I present pickerView instead of keyboard ? Maybe I'm doing it wrong here.. – Aidaaidan

If it's not for textField, why don't you create a view container that has toolBar at the top and picker view below the toolBar. – Steels

Answer 1

Can you try this codes.

    var textField = UITextField(frame: CGRectMake(20, 50, view.width - 40, 30))
    textField.backgroundColor = UIColor.redColor()
    view.addSubview(textField)

    var pickerView = UIPickerView(frame: CGRectMake(0, 200, view.width, 300))
    pickerView.backgroundColor = UIColor.whiteColor()
    pickerView.showsSelectionIndicator = true



    var toolBar = UIToolbar()
    toolBar.barStyle = UIBarStyle.Default
    toolBar.translucent = true
    toolBar.tintColor = UIColor(red: 76/255, green: 217/255, blue: 100/255, alpha: 1)
    toolBar.sizeToFit()


    var doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.Bordered, target: self, action: "donePicker")
    var spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FlexibleSpace, target: nil, action: nil)
    var cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItemStyle.Bordered, target: self, action: "canclePicker")

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

    textField.inputView = pickerView
    textField.inputAccessoryView = toolBar

Steels

Yep thanks heaps, this helped me and works! My issue was I didn't have textField.inputAccessoryView = toolbar, and I was instead adding the UIToolbar as a subview of the UIPicker. Now my Done button is firing like a champion!!! – Beaded

Answer 2

I believe that you need to raise the picker and toolbar using the standard UIResponder mechanism or cheat by using a hidden UITextField to get the same result.

See my updated answer to your original question:

Add buttons to UIPickerView - Swift 1.2

Industrial