MultiStepSlider
A custom UIControl which functions like UISlider where you can set multiple intervals with different step values for each interval. This is useful when an interval spans over large values, for example, price of real estates. In that case it is convenient to divide the large interval in smaller intervals with each interval having its own step value.
#Installation
Add following lines in your pod file if you are using Swift 3
pod ‘MultiStepSlider’, '~> 2.0'
Add following lines in your pod file for previous Swift versions
pod ‘MultiStepSlider’, '~> 1.4'
#Usage
import ‘MultiStepSlider’
In interface builder, drag one UIView and set its class as MultiStepSlider.
Configuration
MultiStepSlider can be configured by the following method.
func configureSlider(intervals intervals: [Interval], preSelectedRange: RangeValue?)
The first parameter is an array of type Interval which is defined as:
public struct Interval {
public private(set) var min: Float = 0.0
public private(set) var max: Float = 0.0
public private(set) var stepValue: Float = 0.0
}
The second parameter is of type RangeValue which is defined as:
public struct RangeValue {
public var lower: Float = 0.0
public var upper: Float = 0.0
}
This dictates the initial positions for lower and upper thumb. The lower and upper of RangeValue should lie within the interval specified and should be a valid node value. For example, if the there is an interval Interval(min: 50000, max: 100000, stepValue: 10000), then 60000 will be a valid node, but not 65000. In that case, a warning will be shown.
Warning: Range contains invalid node
Example
@IBOutlet weak var slider: MultiStepRangeSlider!
override func viewDidLoad() {
super.viewDidLoad()
let intervals = [Interval(min: 50000, max: 100000, stepValue: 10000),
Interval(min: 100000, max: 1000000, stepValue: 100000),
Interval(min: 1000000, max: 3000000, stepValue: 500000)]
let preSelectedRange = RangeValue(lower: 80000, upper: 500000)
slider.configureSlider(intervals: intervals, preSelectedRange: preSelectedRange)
print("continuous: lower = \(slider.continuousCurrentValues.lower) higher = \(slider.continuousCurrentValues.upper)")
print("discrete: lower = \(slider.discreteCurrentValue.lower) higher = \(slider.discreteCurrentValue.upper)")
}
Properties
discreteCurrentValue
This is of type RangeValue and gives the discrete upper and lower value.
continuousCurrentValue
This is of type RangeValue and gives the continuous upper and lower value.
trackTintColor
This color is used to tint the part of the track which is outside the range of lower thumb and upper thumb.
The default color is lightGrayColor.
trackHighlightTintColor
The color used to tint the part of the track which is inside the range of lowerValue and upperValue.
The default color is #007AFF (rgba = 0, 122, 255, 1)
trackCurvaceousness
This property is used to control the curvature of ends of the track. The property can have value from 0 to 1.
trackCurvaceousness = 0.0
trackCurvaceousness = 1.0
thumbCurvaceousness
This property is used to control the curvature of the thumbs. The property can have value from 0 to 1.
trackCurvaceousness = 0.5
trackCurvaceousness = 1.0
shadowEnabled
Setting this property as true will show shadow around the thumbs.
License
MultiStepSlider is available under the MIT License.
597 Nov 22, 2022
246 Jan 3, 2023
2 Mar 24, 2022
153 Sep 15, 2022
26 Nov 26, 2022
286 Dec 15, 2022
50 Jan 6, 2023
13 Nov 17, 2021
12 Oct 10, 2022
340 Dec 16, 2022
644 Dec 12, 2022
88 Oct 2, 2022
12 Oct 30, 2019
34 Sep 26, 2022
7 Aug 3, 2022
1.2k Dec 22, 2022
3.3k Dec 21, 2022
479 Dec 5, 2022
117 Sep 2, 2022