Swift Demo – Add Progress Bar

In this short tutorial, we will see the steps required to add UIProgressView to a Swift IOS Project.

UIProgressView and UILabel showing the current progress will be added programmatically to the View Controller. Create a Single View Application and navigate to ViewController.swift file.

Add UIProgressView and UILabel

Add the following code snippet below the class definition. This code snippet adds variables for UILabel and UIProgressView.

    var progressView: UIProgressView?
    var progressLabel: UILabel? 

Now add the following function which initialises and adds UIProgressView and UILabel to the view.

//MARK:- Controls
    func addControls() {
        // Create Progress View Control
        progressView = UIProgressView(progressViewStyle: UIProgressViewStyle.Default)
        progressView?.center = self.view.center

        // Add Label
        progressLabel = UILabel()
        let frame = CGRectMake(view.center.x - 25, view.center.y - 100, 100, 50)
        progressLabel?.frame = frame

ProgressView style can be set to Default or Bar type. And UILabel needs to be appear just above the ProgressView hence we added an offset from view center.

Add GestureRecogonizers

This demo starts and resets the progress on single and double tap gesture event. The following code snippet adds single and double tap gesture recognisers to the view. This also specifies the function that needs to be called when user does a single or double tap.

func addGestures() {
        // Add Single Tap and Doube Tap Gestures
        let tap = UITapGestureRecognizer(target: self, action: "handleTap:")
        tap.numberOfTapsRequired = 1

        let doubleTap = UITapGestureRecognizer(target: self, action: "handleDoubleTap:")
        doubleTap.numberOfTapsRequired = 2


Now add the required functions for the gesture recogonizer events.

// Start Progress View
    func handleTap(sender: UITapGestureRecognizer) {
        if sender.state == .Ended {
            timer = NSTimer.scheduledTimerWithTimeInterval(1.0, target: self, selector: "updateProgress", userInfo: nil, repeats: true)
    //MARK:- Double Tap
    // Reset Progress View
    func handleDoubleTap(sender: UITapGestureRecognizer) {
        if sender.state == .Ended {
            progressView?.progress = 0.0
            progressLabel?.text = "0 %"

Display Progress

The actual progress will be displayed by the following piece of code in the updateProgress function. You can change progress interval by setting appropriate value to progress property of UIProgressView.

//MARK:- Increment Progress
    func updateProgress() {
        progressView?.progress += 0.05
        let progressValue = self.progressView?.progress
        progressLabel?.text = "\(progressValue! * 100) %"

Finally we need to add the addControls and addGestures to the viewDidLoad method.

override func viewDidLoad() {

Download source code from here (SwiftDemo – ProgressView)

In Category: Xcode

Ravi Shankar

A polyglot software developer and now exploring Swift and iOS development. If you would like to learn from me then check out services page.

Show 0 Comments
No comments yet. Be the first.

Leave a Comment