iOS Tutorials: PickerView on UIAlertController

Have you ever thought of implementing PickerView into UIAlertcontroller? Well, I have and I’ve decided to make a simple tutorial on this as I could possibly see that it could be useful to anyone that is seeking for this method.

As always, create your new project and give it a preferred name for this project.

The only object that we are using right here is Button. So grab a button and put it on the Main.storyboard and connect it to the ViewController.swift with an action type.

We are going do some codings here. First, lets create a an array that contains all the type of cars. Then let’s add UIPickerViewDelegate and UIPickerViewDataSource as we will be using PickerView in the AlertController. However, since we did not use any PickerView object, lets create our own object. Lastly, create a variable that named typeValue

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {
    var choices = ["Toyota","Honda","Chevy","Audi","BMW"]
    var pickerView = UIPickerView()
    var typeValue = String()

Make sure you implement some of the pickerview functionality.

//MARK - PickerView
func numberOfComponents(in pickerView: UIPickerView) -> Int {
    return 1
func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    return choices.count
func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    return choices[row]
func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    if row == 0 {
        typeValue = "Toyota"
    } else if row == 1 {
        typeValue = "Honda"
    } else if row == 2 {
        typeValue = "Chevy"
    } else if row == 3 {
        typeValue = "Audi"
    } else if row == 4 {
        typeValue = "BMW"

Lastly, this would be the action of the button which will then show a PickerView. As you can see, the way this is done is by creating an UIAlertController with several black space contain within the message hoping to create some space for the PickerView. Then we will create the size of the PickerView. With this, we could easily add the PickerView onto the AlertController. You could add most functionality that include Cancel or Ok.

@IBAction func showChoices(_ sender: Any) {
        let alert = UIAlertController(title: "Car Choices", message: "\n\n\n\n\n\n", preferredStyle: .alert)
        alert.isModalInPopover = true
        let pickerFrame = UIPickerView(frame: CGRect(x: 5, y: 20, width: 250, height: 140))
        pickerFrame.dataSource = self
        pickerFrame.delegate = self
        alert.addAction(UIAlertAction(title: "Cancel", style: .cancel, handler: nil))
        alert.addAction(UIAlertAction(title: "OK", style: .default, handler: { (UIAlertAction) in
            print("You selected " + self.typeValue )
        self.present(alert,animated: true, completion: nil )

At the end, the result would be like below:

The GitHub link could be found here

  • Article By :
    Founder of DaddyCoding. Studied Computer Science, Information System and Information Technology at BYU-Hawaii. Currently spending most of my time researching and learning on helping to expose making iOS apps.

Random Posts

One thought on “iOS Tutorials: PickerView on UIAlertController

Leave a Reply

Your email address will not be published. Required fields are marked *