An animated circular progress bar for your iOS projects in Swift.
- Fully animated progress bar.
- Can be used and customized in Interface Builder.
- Customize color, animation duration and size.
- Customize border size for bigger or smaller display.
- Is unit tested.
- iOS 9.0+
NoveCircularProgressBar uses CocoaPods. It is a dependency manager for Cocoa projects.
To integrate NoveCircularProgressBar into your Xcode project using CocoaPods, specify it in your
source 'https://github.com/CocoaPods/Specs.git' use_frameworks! pod 'NoveCircularProgressBar', '~> 1.0'
Then, run the following command:
$ pod install
Creating a new instance
In Interface Builder, you can add a
UIView to your interface, and set the custom class to
You can also create the progress bar programmatically. To do so, simply import the module and use the following initializer:
import NoveCircularProgressBar let progressBar = NoveCircularProgressBar(frame: CGRect(x: 0, y: 0, width: 24, height: 24))
Then, add the progress bar to its parent:
The progress bar is composed of a static border and an animated progress bar.
NoveCircularProgressBar is configurable to match your app requirements. You can adjust the following settings:
colorwill change the progress bar color and its border color.
speedrepresents the duration of the animation for the progress bar to go from 0.0 to 1.0.
lineWidthrepresents the border thickness and the space between the border and the progress bar.
You can set those properties in the Interface Builder:
Or you can set them programmatically once your bar is instanciated:
progressBar.lineWidth = 2.0 progressBar.color = .systemBlue progressBar.speed = 1.0
Once your progress bar is created — and configured — you can update the displayed percentage by calling:
progressBar.updateProgress(to: percentage, animated: true)
With the following parameters
tois the new percentage to display (between 0.0 and 1.0),
animatedtells the component to play an animation or to jump to its destination.
NoveCircularProgressBar is available under the MIT license. See the LICENSE file for more informations.