UIActivityIndicatorView in UIKit

UIActivityIndicatorView is a useful component in the UIKit framework that provides a visual indication that a task is in progress. In this article, we will explore what UIActivityIndicatorViews are, the various functionalities they offer, and provide practical code examples to demonstrate how you can implement and customize them in your iOS projects.

What is a UIActivityIndicatorView?

A UIActivityIndicatorView is a UIControl that displays a spinning wheel to indicate that a task is ongoing. It is commonly used to show that the application is performing a task that may take some time to complete, such as loading data or processing information. The indicator continues spinning until you explicitly stop it, providing a clear visual cue to the user that the app is busy.

What Can You Do with UIActivityIndicatorViews?

UIActivityIndicatorViews offer a range of functionalities and customization options. Here are some key things you can do with UIActivityIndicatorViews:

• Start and Stop Animating: Control when the activity indicator starts and stops animating.
• Hide When Stopped: Automatically hide the indicator when it is not animating.
• Custom Appearance: Customize the appearance of the activity indicator, including its color and style.
• Indicator Styles: Choose from different indicator styles (large, medium, or small).
• Accessibility: Provide accessibility information for the activity indicator to enhance the user experience for all users.

Implementing UIActivityIndicatorView in Swift

Let's dive into some code examples to see how you can create, customize, and work with UIActivityIndicatorViews in Swift.

To create a simple UIActivityIndicatorView, you need to initialize it and add it to your view. Here is an example:

import UIKit

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white

        // Create a UIActivityIndicatorView
        let activityIndicator = UIActivityIndicatorView(style: .large)
        activityIndicator.center = view.center
        activityIndicator.startAnimating()
        
        // Add the activity indicator to the view
        view.addSubview(activityIndicator)
    }
}

In this example, we create a UIActivityIndicatorView with the large style and position it at the center of the view. The activity indicator starts animating immediately when the view loads.

Starting and Stopping UIActivityIndicatorView

You can start and stop the UIActivityIndicatorView programmatically to control when the indicator is shown. Here is an example:

import UIKit

class ViewController: UIViewController {
    let activityIndicator = UIActivityIndicatorView(style: .large)

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white

        // Configure the activity indicator
        activityIndicator.center = view.center
        activityIndicator.hidesWhenStopped = true
        
        // Add the activity indicator to the view
        view.addSubview(activityIndicator)
        
        // Simulate starting and stopping the activity indicator
        performTask()
    }

    func performTask() {
        activityIndicator.startAnimating()
        
        // Simulate a task by delaying for 3 seconds
        DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
            self.activityIndicator.stopAnimating()
        }
    }
}

In this example, we create a UIActivityIndicatorView and configure it to hide when stopped. We simulate a task by starting the indicator, waiting for 3 seconds, and then stopping the indicator.

Customizing UIActivityIndicatorView Appearance

You can customize the appearance of UIActivityIndicatorView to match the design of your application. Here is an example of customizing the color:

import UIKit

class ViewController: UIViewController {
    let activityIndicator = UIActivityIndicatorView(style: .large)

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white

        // Configure the activity indicator
        activityIndicator.center = view.center
        activityIndicator.color = .blue
        activityIndicator.hidesWhenStopped = true
        
        // Add the activity indicator to the view
        view.addSubview(activityIndicator)
        
        // Simulate starting and stopping the activity indicator
        performTask()
    }

    func performTask() {
        activityIndicator.startAnimating()
        
        // Simulate a task by delaying for 3 seconds
        DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
            self.activityIndicator.stopAnimating()
        }
    }
}

In this example, we customize the UIActivityIndicatorView by setting its color to blue. This changes the color of the spinning wheel.

Handling Multiple UIActivityIndicatorViews

You can manage multiple UIActivityIndicatorViews within the same view to indicate different tasks. Here is an example:

import UIKit

class ViewController: UIViewController {
    let activityIndicator1 = UIActivityIndicatorView(style: .large)
    let activityIndicator2 = UIActivityIndicatorView(style: .medium)

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white

        // Configure the first activity indicator
        activityIndicator1.center = CGPoint(x: view.center.x, y: view.center.y - 50)
        activityIndicator1.color = .red
        activityIndicator1.hidesWhenStopped = true
        
        // Configure the second activity indicator
        activityIndicator2.center = CGPoint(x: view.center.x, y: view.center.y + 50)
        activityIndicator2.color = .green
        activityIndicator2.hidesWhenStopped = true
        
        // Add the activity indicators to the view
        view.addSubview(activityIndicator1)
        view.addSubview(activityIndicator2)
        
        // Simulate starting and stopping the activity indicators
        performTasks()
    }

    func performTasks() {
        activityIndicator1.startAnimating()
        activityIndicator2.startAnimating()
        
        // Simulate tasks by delaying for different durations
        DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
            self.activityIndicator1.stopAnimating()
        }
        
        DispatchQueue.main.asyncAfter(deadline: .now() + 4) {
            self.activityIndicator2.stopAnimating()
        }
    }
}

In this example, we create two UIActivityIndicatorViews with different styles and colors. We position them at different points in the view and simulate tasks with different durations to show how multiple indicators can be managed simultaneously.

Conclusion

UIActivityIndicatorViews are essential components for providing visual feedback during long-running tasks in your iOS applications. In this article, we've covered the basics of what UIActivityIndicatorViews are, their various functionalities, and provided practical code examples to help you implement and customize them in your own projects. From creating simple activity indicators to customizing their appearance and managing multiple indicators, mastering UIActivityIndicatorViews is crucial for building intuitive and user-friendly interfaces.