Do you miss the 90s? We know you do. Dial-up internet, flickering screens, brightly colored websites and, of course, this annoyingly slow progress bar that has been invented to test your patience. Yes, it was a while ago, but we don't want it to be forgotten. Meet RetroProgress, a progress bar made to cure your 90s nostalgia.
- Easy to use and customizable progress bar.
- Support for both progress value (0...1) and number of steps.
- Progress animations.
- No external dependencies.
- Playgrounds.
- Demo project.
Are you excited to bring this thing back from the dead? So are we. Let's use default configuration and see what we get out-of-the-box:
let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))
progressView.animateProgress(to: 0.8)
Do you think it's way too retro? Let's try to make it more modern:
let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))
// Configure
progressView.layer.cornerRadius = 10
progressView.layer.borderColor = UIColor.black.cgColor
progressView.trackColor = .white
progressView.separatorColor = .black
progressView.progressColor = UIColor(
red: 218/255,
green: 236/255,
blue: 255/255,
alpha: 1
)
// Set progress
progressView.animateProgress(to: 0.8)
Not a fan of those separators? Let's try without them:
let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))
// Configure
progressView.numberOfSteps = 0
progressView.progressInset = .zero
progressView.layer.cornerRadius = 15
progressView.layer.borderColor = UIColor.white.cgColor
progressView.trackColor = .black
progressView.progressColor = .white
// Set progress
progressView.animateProgress(to: 0.8)
The options are limitless. Think big, now it's your turn to make the progress bar great again.
numberOfSteps- Maximum number of steps. Set to 0 to remove separators.step- Number of separators (0...numberOfSteps). Values outside are pinned.progress- 0...1, default is 0. Values outside are pinned.progressInset- The inner inset for progress bar and separators.trackColor- The color shown for the portion of the progress bar that is not filled.progressColor- The color shown for the portion of the progress bar that is filled.separatorColor- The color used for the step separators.fullProgressAnimationDuration- The duration for progress animation from 0 to 1.separatorWidth- The width of step separators.
animateProgress(to:duration:)- Animates progress bar to the specified value (0...1).animateSteps(to:duration:)- Animates progress bar to the specified value (0...numberOfSteps).
RetroProgress is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod 'RetroProgress'RetroProgress is also available through Carthage. To install just write into your Cartfile:
github "vadymmarkov/RetroProgress"RetroProgress can also be installed manually. Just download and drop Sources folders in your project.
Vadym Markov, [email protected]
This library was originally done at Hyper, a digital communications agency with a passion for good code and delightful user experiences.
Check the CONTRIBUTING file for more info.
RetroProgress is available under the MIT license. See the LICENSE file for more info.