复古外观进度条直接从 90 年代开始
描述
你想念90年代吗?我们知道您知道。拨号上网,闪烁的屏幕,色彩鲜艳的网站,当然还有这个令人讨厌的缓慢进度条,它是为了测试你的耐心而发明的。是的,那是不久前的事了,但我们不希望它被遗忘。认识 RetroProgress,这是一个进度条,旨在治愈您的 90 年代怀旧情绪。
目录
用法
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.
Public properties
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.
Public methods
animateProgress(to:duration:)
– Animates progress bar to the specified value (0…1).animateSteps(to:duration:)
– Animates progress bar to the specified value (0…numberOfSteps).
Installation
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 folders in your project.Sources
Author
Vadym Markov, [email protected]
Credits
This library was originally done at Hyper, a digital communications agency with a passion for good code and delightful user experiences.
Contributing
Check the CONTRIBUTING file for more info.
License
RetroProgress is available under the MIT license. See the LICENSE file for more info.