3 Component Dynamic Multi UIPickerView Swift

Question

I'm new to Swift programming (doing it for fun :)) and am stuck with trying to create a 3 component UIpickerview where each component changes its value based on the previous component selected. I've nearly got it to work but stuck with the last component - comes up with a Fatal Error: Index out of range in my pickerview titleForRow method (when it goes to return cities[selectedCity].post[row]) Any advice/help will be really appreciated!

Many thanks in advance.

import UIKit

class Country { var name: String var cities: [City]

init(name:String, cities:[City]) {
    self.name = name
    self.cities = cities
}

}

class City { var name: String var posts: [String]

init(name:String, posts:[String]) {
    self.name = name
    self.posts = posts
}

}

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {

@IBOutlet weak var pickerView: UIPickerView!
@IBOutlet weak var countryLbl: UILabel!

var countries = [Country]()

override func viewDidLoad() {

    pickerView.delegate = self
    pickerView.dataSource = self

    countries.append(Country(name: "UK", cities: [City(name: "London", posts: ["L01", "L02", "L03"]),City(name: "Manchester", posts: ["M01", "M02"]), City(name: "Bristol", posts: ["B01", "B02", "B03"])]))
    countries.append(Country(name: "USA", cities: [City(name: "New York", posts: ["N01"]),City(name: "Chicago", posts: ["C01", "C02"])]))
    countries.append(Country(name: "China", cities: [City(name: "Beijing", posts: ["BL01", "BL02", "BL03", "BL04"]),City(name: "Shanghai", posts: ["SM01", "SM02"]), City(name: "Shenzhen", posts: ["SB01", "SB02", "SB03"]), City(name: "Hong Kong", posts: ["SH01"])]))

    super.viewDidLoad()

}

func numberOfComponents(in pickerView: UIPickerView) -> Int {
    return 3
}

func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {

    if component == 0 {
        return countries.count
    } else if component == 1 {
        let selectedCountry = pickerView.selectedRow(inComponent: 0)
        return countries[selectedCountry].cities.count
    } else {
        let selectedCountry = pickerView.selectedRow(inComponent: 0)
        let selectedCity = pickerView.selectedRow(inComponent: 1)
        return countries[selectedCountry].cities[selectedCity].posts.count
    }
}

func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    if component == 0 {
        return countries[row].name
    } else if component == 1{
        let selectedCountry = pickerView.selectedRow(inComponent: 0)
        return countries[selectedCountry].cities[row].name
    } else {
        let selectedCountry = pickerView.selectedRow(inComponent: 0)
        let selectedCity = pickerView.selectedRow(inComponent: 1)
        return countries[selectedCountry].cities[selectedCity].posts[row]
    }
}

func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    pickerView.reloadComponent(0)
    pickerView.reloadComponent(1)

    let selectedCountry = pickerView.selectedRow(inComponent: 0)
    let selectedCity = pickerView.selectedRow(inComponent: 1)
    let selectedPost = pickerView.selectedRow(inComponent: 2)
    let post = countries[selectedCountry].cities[selectedCity].posts

    countryLbl.text = "The right answer was: \(post) in \(selectedCountry)"

}

}

In didSelectRow, reloadAllComponents instead of only 1. BUT after reloading all components, again posts are not related to cities. So you need to modify your object properties — Jay Patel

Jay Patel Jay Patel · Accepted Answer · 2018-08-16T09:00:08

Create Country & City objects like below. Assign array of City to cities.

class Country {

    var name: String
    var cities: [City]

    init(name:String, cities:[City]) {
        self.name = name
        self.cities = cities
    }
}

class City {

    var name: String
    var posts: [String]

    init(name:String, posts:[String]) {
        self.name = name
        self.posts = posts
    }
}

3 Component Dynamic Multi UIPickerView Swift

1 Answers