Keeping a regular check on the progress of project completion is a bit difficult, but not anymore, We have created our own custom progress view to measure the progress of the individual project on an individual day based on the task completion. That helps us to generate daily reports with specific numbers.
Using Annular progress view now it's no longer difficult to measure the bang on results!
A powerful Circular Slider which has been written in SwiftUI
To run the example project, clone the repo, and run pod install
from the Example directory.
- iOS 13.0+
- Xcode 12.5+
Circular Slider is available through CocoaPods. To install it, simply add the following line to your Podfile:
To install it, simply add the following line to your Podfile:
pod 'CircularSlider', git: 'https://github.com/PiyushSelarka/CircularSlider.git', branch: 'main'
Added import CircularSlider
import CircularSlider
Configration for Circular Slider with completion
CircularSlider(config: Config(minimumValue: 0.0,
maximumValue: 100,
totalValue: 100,
knobRadius: 10,
radius: 125,TotalProgressView: 20.0,
outercircleColor: Color.init(red: 64/255, green: 66/255, blue: 131/255),
innercircleColor: RadialGradient(gradient: Gradient(colors: [.white, .gray]), center: .center, startRadius: 50, endRadius: 100),
lineColor: Color(UIColor.lightGray),
lineWidth: 1.0,
tickColor: Color.gray,
tickhighlightedColor: Color.white,
sliderColor: LinearGradient(gradient: Gradient(colors: [.blue, .white]),startPoint: .topLeading, endPoint: .bottomLeading),
startPointCircleColor: RadialGradient(gradient: Gradient(colors: [.white, .blue,]), center: .center, startRadius: 0, endRadius: 7),
pointCircleColor: RadialGradient(gradient: Gradient(colors: [.blue, .white]), center: .center, startRadius: 0, endRadius: 7),
titleText: "Monday"
),
completion: { (value) in
print(value) // Getting slider value
}
)
Minimum Value of the slider or you can say start value for the slider. It will set in CGFloat.init
Maximum value for the slider which is set in CGFloat.init
TotalValue will help to measure progress of the circle while moving which should be equal to maximum value
The Radius of the know that how large you want to show
Size or area of Progress view which can be define by radius
The color of back circle set in Color.init
The color of inner side circle set in RadialGradient.init
The color of line in inner circle set in Color.init
The width of line in inner circle set in CGFloat.init
The color of tick in 360 degree circle set in Color.init
The color of tick highlighted in 360 degree circle set in Color.init
The color of slider set in LinearGradient.init
The slider start circle color set in RadialGradient.init
The slider drag circle color set in RadialGradient.init
set Title text in circle
When you want to put a static number to show the progress only then you can pass the number in this property which will help you to show the circular bar based on the value you pass
completion: { (value) in
print(value) // Getting slider value
}
MI-Circular Slider is MIT-licensed.
If you use our open-source libraries in your project, please make sure to credit us and Give a star to www.mindinventory.com