An animatable progress bar that can easily be used to display progress.
- Swift 4.2
- iOS 10 or later
Add the following to your Podfile
:
pod 'ProgressBarKit'
For a full deep-dive, refer to the full documentation.
It's very easy to start using the progress bar. Simply:
- Import and initialize
- Setup
- Set progress value
But... i need more customization. Sure, go straight here!
import ProgressBarKit
class ViewController: UIViewController {
lazy var progressBar: ProgressBar = {
ProgressBar(trackColour: [.black], barColour: [.purple])
}()
}
Specify the UIView
that will be the progress bar's container view and initializes the progress bar in it.
progressBar.setup(in: myContainerView)
Important:
This method should only be called ONCE, and only in viewDidLayoutSubviews
to ensure the container
has already been laid out correctly by AutoLayout.
Animates the progress bar from 0
until the given percentage value (in decimal number) of the total width of the progress bar container view.
ie. Given, value = 0.75
and containerView.frame.width
is 100
The progress bar will only be expanded until a width of 0.75 * 100
which is 75 points.
progressBar.setProgressBarValue(to: 0.75)
Note:
This method should only be called after calling setupProgressBar(in:)
to ensure the progress bar is already initialized.
So your designer put or you wanted a little bit more challenge to your design. Fret not, ProgressBarKit mostly got you covered!
let bar = ProgressBar(trackColour: [.black], barColour: [.purple])
let barConfig = PBBarConfiguration(
roundingCorners: [.allCorners],
cornerRadii: CGSize(width: 8, height: 8)
)
let bar = ProgressBar(trackColour: [.black], barColour: [.purple], configurations: [.bar: barConfig])
let trackConfig = PBTrackConfiguration(
roundingCorners: [.allCorners],
cornerRadii: CGSize(width: 8, height: 8),
edgeInsets: UIEdgeInsets(top: 2.5, left: 2.5, bottom: 2.5, right: 2.5)
)
let bar = ProgressBar(trackColour: [.black], barColour: [.purple], configurations: [.track: [trackConfig]])
let firstTrackConfig = PBTrackConfiguration(
roundingCorners: [.topLeft, .bottomLeft],
cornerRadii: CGSize(width: 8, height: 8),
edgeInsets: UIEdgeInsets(top: 2.5, left: 2.5, bottom: 2.5, right: 2.5)
)
let lastTrackConfig = PBTrackConfiguration(
roundingCorners: [.topRight, .bottomRight],
cornerRadii: CGSize(width: 8, height: 8),
edgeInsets: UIEdgeInsets(top: 2.5, left: 2.5, bottom: 2.5, right: 2.5)
)
// use default values
let otherTrackConfig = PBTrackConfiguration()
// this will display 3 tracks with different configurations, and
// you can have some fun here by adding more configs into the array, and
// watch the magic happens!
let configs = [firstTrackConfig, otherTrackConfig, lastTrackConfig]
let bar = ProgressBar(trackColour: [.black], barColour: [.purple], configurations: [.track: configs])
// use default values
let defaultTrackConfig = PBTrackConfiguration()
// this will display the track and bar in gradient colours
// you can have some fun here by adding more colours into the array, and
// watch the gradient colour changes!
let gradientTrackColours: [UIColor] = [.black, .white]
let gradientBarColours: [UIColor] = [.red, .purple]
let configs = [defaultTrackConfig, defaultTrackConfig, defaultTrackConfig]
let bar = ProgressBar(trackColour: gradientTrackColours, barColour: gradientBarColours, configurations: [.track: configs])
We'd love to accept your patches and contributions to this project! Checkout contributing and code of conduct to learn more.
See LICENSE file for details