Switches toggle on and off, and activity indicators show that a task is being completed. See how to create and customize these controls in this video.
- [Instructor] Here's a simple application that shows a progress bar advancing and it also has what's known as an activity indicator view. Note that this is different from the activity view controller that we looked at earlier. The activity indicator view indicates activity. It's also known as a spinner. So what we want to do is have this spinner stop spinning when the progress bar is complete. So let's return to Xcode and stop the application.
And let's look at our storyboard first. So in the storyboard, I have a progress bar and an activity indicator. With the activity indicator selected in the document outline, go in to head over to the Attributes Inspector and show some of the custom settings that I added to it. For the style, I chose Large White to make it a little bit easier to see. For the color I chose a gray color. If you want to make it a little bit darker so it's easier to see, you could do that as well. And I'm choosing Animating and Hides When Stopped so all we have to do to hide it is to stop it.
Both this and the progress view have already previously been connected to code, so we have them both right here. Let's hide that right area to get a little bit more space, make the code a little more readable, and take a look at viewDidLoad. In viewDidLoad, I set progress view's progress property to zero, and then I created a timer. That's what you're seeing when you see the progress bar animating. This timer creates a block of code that runs every time this time interval is reached.
This is 0.03 seconds. So every 0.03 seconds the code inside of this block runs. So it runs over and over and over again, adding on to the value of progress of the progress view. I also want to point out that when you have code inside of what's known as a block in Swift, you need to refer to any objects that are inside of your class, or variables rather, using the keyword self.
Otherwise, you won't be able to access them. So you need to specifically say that they belong to self. So let's say we want to stop the activity indicator when the progress bar is complete. To do that, underneath this line of code, create an if statement to check to see the value of the progress view. So if self.progressView.progress is greater than or equal to, so a greater than sign then an equal sign, then a one, and then put some curly braces, so open curly brace and then closed curly brace.
And inside of there, we'll first stop the timer. We can reference the timer right here. So we'll stop it with timer.invalidate. Of course that's not related to the activity indicator and the app will still work without it. But whenever you're using a timer like this it's a best practice to make sure that you stop it at some point. On the next line, we'll stop the activity indicator. So activityIndicator dot and then we call stopAnimating.
So if hidesWhenStopped is true, which we can set here if we wanted to, when we stop animating, the activity indicator view will automatically hide. So let's call stopAnimating and run the app now. Notice that I tried to run it without using a reference to self. If you click on the error message it says reference to property activityindicator in closure requires explicit self to make capture semantics explicit. Insert self, and you can do that by hitting the Fix button.
So if you ever see that error in your code, it's because you're referencing variables inside of a block. So you just need to add self before the variable name and it should work. Run the app now and you should see the progress bar move across the screen. When it gets to the end, then the timer stops and the activity indicator view should hide. So the activity indicator view is spinning and it disappears when the progress bar fills up.
So remember, if you want to use an activity indicator view, you can simply put it wherever you want and then when you're done with it, make it stop animating.
- Alert controllers and actions
- Sliders, progress bars, and switches
- Creating UI elements with code
- Displaying web content with Safari view controllers and WKWebView
- Creating collection view controllers
- Creating tabbed apps
- Publishing your app with App Store Connect