Make App Pie

Training for Developers and Artists

Protocols and Time Pickers

While there is the date components picker, sometimes you want a picker the gives a time interval in seconds. In this two-part tutorial, Let me show you how to set up one, and discuss some good uses of protocols beyondself

If you download the exercise files, you’ll see I set up a project with two pickers and set outlets for them. I also set up two view controllers and another Swift file I named Time components.

If you are familiar withUIPickerViews, you know that they use a delegate and data source to set the components and return values. Usually, you set the delegate and data source toself. However, that means you set the component values in each view controller. I want for my project to have hours, minutes and seconds on every picker. Instead of writing the code for that several times, I’ll make a separate object that has the delegates and data sources, then use it in both view controllers.
Go to time components. You’ll see I already added the delegate and data source methods for you to add the code. There are several ways I usually do this depending on the flexibility I need from the picker, but the easiest starts with an array of the maximum value for each picker component.

let componentMax = [5,9,0,5,9,0,5,9]// 0 = separator

I’ll also set a string to be my separator. I’ll make this avar so I can change it later.

var separator = ":"

I’ll put a zero for anywhere I want a separator in the components. For the numberOfComponents, I’ll return the count for that array

func numberOfComponents(in pickerView: UIPickerView) -> Int {
return componentMax.count

Next, I’ll define the number of rows incomponent To account for 0, that’s one more than the componentMax element. I’ll return

return componentMax[component] + 1

I’ll use a simpletitleForRow method to display this. IfcomponentMax was 0, return the separator string.

if componentMax[component] == 0 {
return seperator

Otherwise, return a string of that row value.

return String(format: "%i", row)

That sets up the display part. Head to theViewController.
Add a constant timeComponents

let timeComponents = TimeComponents()

InviewDidLoad, add the delegate and data source to be TimeComponents. When the picker needs them, It will use this object.
Do the same for theSecondViewController. Add the object

let timeComponents = TimeComponents()

Then set the delegates and data sources.

picker.dataSource = timeComponents
picker.delegate = timeComponents

And do one more thing. Set the separator to a period.

timeComponents.separator = "."

Run this on the simulator. Move the wheels around and you’ll find you can set a time in the range we requested.

Click the button on top and you’ll get the second view controller and can do the same.

You can see the power of using a protocol for more than one view controller. You don’t always wantself when you have a standard case for your delegates and data sources. Of course, you will want the value out of this example. In next week’s tip, we’ll look at that. You’ll convert Strings to TimeIntervals, then send back the data to the view controller.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: