Reputation: 3843
I have created a UISlider that has tick marks and snaps to each tick when the value is changed. The problem is that the slider doesn't naturally go to the ends and the left and right tick are visible outside of the circle. I have extended the UISlider class to go to the ends but the animation conflicts with moving the slider to the next tick and the circle ends up off the screen. How can I keep the snap to tick animation and have the circle in the slider go all the way to the end? Here is my code
class CustomSlider: UISlider {
override func thumbRect(forBounds bounds: CGRect, trackRect rect: CGRect, value: Float) -> CGRect
{
let unadjustedThumbrect = super.thumbRect(forBounds: bounds, trackRect: rect, value: value)
let thumbOffsetToApplyOnEachSide:CGFloat = unadjustedThumbrect.size.width / 2.0
let minOffsetToAdd = -thumbOffsetToApplyOnEachSide
let maxOffsetToAdd = thumbOffsetToApplyOnEachSide
let offsetForValue = minOffsetToAdd + (maxOffsetToAdd - minOffsetToAdd) * CGFloat(value / (self.maximumValue - self.minimumValue))
var origin = unadjustedThumbrect.origin
origin.x += offsetForValue
return CGRect(origin: origin, size: unadjustedThumbrect.size)
}
}
@IBOutlet weak var slider: CustomSlider!
let tickArray : [Float] = [Float(18),Float(20),Float(22),Float(24),Float(26),Float(28),Float(30)]
override func viewDidLoad() {
super.viewDidLoad()
self.slider.value = tickArray[0]
self.slider.minimumValue = tickArray[0]
self.slider.maximumValue = tickArray[6]
self.slider.isContinuous = false
var tick : UIView
for i in 0..<tickArray.count-1 {
tick = UIView(frame: CGRect(x: (self.slider.frame.size.width/6) * CGFloat(i), y: (slider.frame.size.height - 13) / 2, width: 2, height: 13))
tick.backgroundColor = "8E8E93".hexColor
slider.insertSubview(tick, belowSubview: slider)
}
tick = UIView(frame: CGRect(x: self.slider.frame.size.width-2, y: (slider.frame.size.height - 13) / 2, width: 2, height: 13))
tick.backgroundColor = "8E8E93".hexColor
slider.insertSubview(tick, belowSubview: slider)
}
@IBAction func sliderValueChanged(_ sender: UISlider) {
if sender.value > tickArray[5] {
slider.value = tickArray[6]
} else if sender.value > tickArray[4] {
slider.value = tickArray[5]
} else if sender.value > tickArray[3] {
slider.value = tickArray[4]
} else if sender.value > tickArray[2] {
slider.value = tickArray[3]
} else if sender.value > tickArray[1] {
slider.value = tickArray[2]
} else if sender.value >
tickArray[0] {
slider.value = tickArray[1]
} else {
slider.value = tickArray[0]
}
}
Upvotes: 2
Views: 743
Reputation: 3843
I fixed my problem by hiding the left and right ticks when the slider goes to the edges. This took away the need for the slider extension.
Upvotes: 1