• Open the Main.storyboard and take a look at the interface. You should find a UIPickerView at the bottom of the screen. Then head over to the CoinManager.swift file to find a CoinManager struct with two constants already created: currencyArray and baseURL.

• Create the following 3 IBOutlets and name them according to the image below:

The UIPicker is the scroll wheel that shows all the available currencies that we can query the API for a Bitcoin price. It’s a neat way of selecting options without having to have a load of buttons take up screen real estate. There are just a few steps that are required to set it up though. Let’s do it together.

• Open the ViewController.swift code page. Right at the top of the class declaration, we are going to add a protocol called UIPickerViewDataSource.

This says that the ViewController class is capable of providing data to any UIPickerViews. But actually, we don’t have all the required methods implemented. #fakeItTillYouMakeIt

• Let’s make Xcode happy by clicking on the error symbol and selecting Fix to insert the required methods.

• Next, we need to set the ViewController.swift as the datasource for the picker. Find viewDidLoad() and add set the ViewController class as the datasource to the currencyPicker object.

• Now let’s actually provide the data and add the implementation for the first method numberOfComponents(in:) to determine how many columns we want in our picker.

• Next, we need to tell Xcode how many rows this picker should have using the pickerView:numberOfRowsInComponent: method. We are programmers. We don’t have the time to count the number of currencies we need to display. Let’s use the count method on the currencyArray in the CoinManager to get that information.

Next, let’s update the PickerView with some titles and detect when it is interacted with. To do this we have set up the PickerView’s delegate methods.

• Add the protocol UIPickerViewDelegate to the class declaration and set the ViewController class as the delegate of the currencyPicker.

• Next, add the delegate method pickerView(titleForRow:), start typing pickerView and select the method from the drop down list.

This method expects a String as an output. The String is the title for a given row. When the PickerView is loading up, it will ask its delegate for a row title and call the above method once for every row. So when it is trying to get the title for the first row, it will pass in a row value of 0 and a component (column) value of 0.

• So inside the method, we can use the row Int to pick the title from our currencyArray.

• Let’s run our app and see if everything looks as intended.

Great. We’ve got a functioning Picker View. But nothing happens when you make a selection. Let’s change that.

• Use Xcode’s auto-suggest to add this delegate method:

This will get called every time when the user scrolls the picker. When that happens it will record the row number that was selected.

• Let’s print that row number to see which one gets selected when we scroll our UIPickerView.

• Run the app and see if the console log is what you were expecting.

Ok. Using the row number is actually pretty unintuitive. Let’s change that print statement to print the currency selected instead.

• Challenge: See if you can change the code to print the currency value selected instead of the row number. The answer is upside-down.

• In the CoinManager struct create the following method, notice that it has both an external and internal parameter name.

• Challenge: Update the pickerView(didSelectRow:) method to pass the selected currency to the CoinManager via the getCoinPrice() method. The solution is upside down.

SOLUTION

Check out the solution to this challenge step by cloning the project from the link below:

https://github.com/appbrewery/ByteCoin-iOS13-Completed/tree/Step-2-Solution