16 Jul 2017

Create UIProgressView in swift

Introduction to UIProgressView:

UIProgressView is the control used in iOS apps to show the progress of a particular task of the app. UIProgressView allows developers to let the users know how much amount of the task is done and how much is still pending. One can think of an example, like we when we install a particular software on desktop. During installation process we see a progress bar that tells how much the software installation is pending. In the same when we have to show progress of a particular task in iOS app we can use or we will use UIProgressView to full-fill our need. In this tutorial, you will learn how to create UIProgressView in swift.

In this tutorial we will, only covered basic functionality of UIProgressView in swift. Some of the important properties of UIProgressView are

trackImage = An image to use for the portion of the track that is not filled.

progressImage = An image to use for the portion of the progress bar that is filled.

Steps to create UIProgressView in swift:

Step 1: Create a new Xcode project, select template "Single View Application". Give product name "UIProgressViewTutorialSwift", set language to "Swift". Same is shown in the picture below

Step2: Open "Main.storyboard", drag "UIProgressView" control from object library to ViewController's view.

Step3: Add constraints to the UIProgressView as shown in below picture.

After adding constraints, check for them that they were added correctly as shown in the image below

Step4: Open "ViewController.swift" and add given below code to as shown

In above code, we created IBOutlet for UIProgressView, so that we can connect it in "Main.storyboard" and created a variable "progressValue"(this variable will get increased after 0.2 seconds). Then we created a function "updateProgress" that will increase the progress of UIProgressView as per "progressValue". The function "updateProgress"will continuously gets called until our "progressValue" reach at 1.0. UIProgressView has minimum value = 0.0 and maximum value = 1.0

Step5: Open Main.storyboard and connect IBOultlet to UIProgressView as shown below

Step6: Run the app and you will see the UIProgressView will gets updated and blue bar fills up grey one.

Where to go from here:

In this tutorial, we learn how to create and use UIProgressView in swift. We only covered basic functionality of UIProgressView. Hope you enjoyed the tutorial. Stay tuned for more tutorial on swift.