UISlider thumb changes when touch drags outside

Question

I am changing the image on a UISlider thumb as follows:

[mySlider setThumbImage:thumbRegular forState:UIControlStateNormal];
[mySlider setThumbImage:thumbActive forState:UIControlStateHighlighted];

When I scrub, it all works as I expect, but when my finger falls off the thumb while scrubbing (drags outside), the thumb image changes back to "thumbRegular", even though the scrubbing itself continues normally. (And changes back to "thumbActive" as the dragging comes back inside).

Any ideas on how to correct this behaviour? Or is it expected behaviour?

Answer 1

Happened to me too. Just make sure to set the minimumValue, maximumValue and value after setting up your thumb image and everything would work fine on ios 6.

[mySlider setThumbImage:[UIImage imageNamed:@"image.png"] forState:UIControlStateNormal];
[mySlider setMinimumTrackImage:[UIImage new] forState:UIControlStateNormal];
[mySlider setMaximumTrackImage:[UIImage new] forState:UIControlStateNormal];

mySlider.minimumValue = 0;
mySlider.maximumValue = 100;
mySlider.value = 100;

Answer 2

You can define your thumb for normal state and drag inside in your viewDidLoad() like you did:

mySlider.setThumbImage(normalImage, forState: UIControlState.Normal)
mySlider.setThumbImage(selectedImage, forState: UIControlState.Highlighted)

And implement UISlider actions such as Touch Drag Outside and Value Changed in your ViewController.

Example:

@IBAction func sliderValueChangedAction(sender: UISlider)  {
        mySlider.setThumbImage(normalImage, forState: UIControlState.Normal)
    }

@IBAction func sliderDragOutside(sender: UISlider) {
        mySlider.setThumbImage(selectedImage, forState: UIControlState.Normal)
    }

These two actions allow you to differentiate the thumb between the normal state and when your dragging the thumb outside the UISlider.