UISlider setMaximumTrackTintColor in iOS 7.1

Question

[slider setMaximumTrackTintColor: color]

has unexpected results in iOS 7.1 (the slider bar changes its position appearing at top instead of vertical center or disappears completely), while working fine with prior versions.

[slider setMinimumTrackTintColor: color]

does render the expected result.

This question might be related: UISlider setMaximumTrackTintColor, but no answer so far.

Update:

I get this: wrong instead of: enter image description here

Update #2:

Using setMaximumTrackImage might work, but the solution I'm looking for is a way to set any random color and not a preexisting image.

Update #3:

This issue is still present in iOS 7.1.1.

Did explain in parentheses, but added screenshots anyway for clarity. — user623396, Mar 12 '14 at 08:30
that's why, I asked this question. It's not worked with 7.1 means, it may work with ios7.0? — Mani, Mar 12 '14 at 08:36
_"while working fine with prior versions"_ means yes, it works in iOS 7.0, 6.1, etc. — user623396, Mar 12 '14 at 08:41
Also, `[slider setThumbTintColor:color]` does't have any effect, but that's probably a different issue. — user623396, Mar 12 '14 at 10:31
What is the view hierarchy of the slider? When do you set tint color? — vokilam, Mar 12 '14 at 10:39
The slider is placed in a standard UIView from IB. The color is set dynamically in the slider's _Value Changed_ event. — user623396, Mar 12 '14 at 10:47

score 18 · Accepted Answer · answered Mar 20 '14 at 11:54

18

Found this workaroud:

Create a 1x1px UIImage from a UIColor on the fly:

CGRect rect = CGRectMake(0, 0, 1, 1);
UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);
[color setFill];
UIRectFill(rect);
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

and then

[slider setMaximumTrackImage:image forState:UIControlStateNormal];

Looks like an expensive solution but it gets the job done.

answered Mar 20 '14 at 11:54

user623396

1,537
1
17
39

Thanks... works perfectly as a workaround until Apple fix this – iOSAppDev Mar 27 '14 at 07:18

HorseT · Answer 2 · 2014-03-14T06:38:11.047

1

Update

Reported this bug and it's already well known. Hopefully they will fix it soon...

edited Mar 14 '14 at 06:38

answered Mar 12 '14 at 10:29

HorseT

6,592
2
18
16

I'm using the stock `UISlider` class. The `MPVolumeView` does use an `UISlider` object, so our problems are related. – user623396 Mar 12 '14 at 10:39
Yes, I know. Just wanted to clarify what your are trying to achieve. I've build a project where I'm using a UISlider and customized it too. But I'm not sure if I set the MaxTintColor myself. I will check this and give a response.. – HorseT Mar 12 '14 at 10:55
I've tried to add a comment above but the system said I must have 50 reputation to be able doing this. Sorry – HorseT Mar 12 '14 at 11:05
In my case the tint color is set dynamically in the slider's **Value Changed** event. (the color goes from green to red based on the slider value) – user623396 Mar 12 '14 at 12:10
No no, every code is happening with a standard UISlider. It`s strange because changing the minTrackTintColor works well if for example slider.value > .5f – HorseT Mar 12 '14 at 12:28
Do you have an official response from Apple? Any link that shows it's a known issue or any possible workaround? Thanks. – user623396 Mar 14 '14 at 09:50
I've just opened a new bug report and got a notification that this bug is already known. if you want, you can try it yourself: http://bugreport.apple.com – HorseT Mar 14 '14 at 19:34

score 1 · Answer 3 · answered Mar 12 '14 at 13:08

1

Try this out:

UIImage *sliderLeftTrackImage = [[UIImage imageNamed:@"LeftImage.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
UIImage *sliderRightTrackImage = [[UIImage imageNamed:@"RightImage.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];

[sliderName setMinimumTrackImage: sliderLeftTrackImage forState: UIControlStateNormal];
[sliderName setMaximumTrackImage: sliderRightTrackImage forState: UIControlStateNormal];

If you want to change thumb image the following code will work:

[sliderName setThumbImage:[UIImage imageNamed:@"ThumbImgName.png"] forState:UIControlStateNormal];
[sliderName setThumbImage:[UIImage imageNamed:@"ThumbImgName.png"] forState:UIControlStateHighlighted];

In same way, you can also use color instead of images.

answered Mar 12 '14 at 13:08

msmq

1,298
16
28

That doesn't work for me, I need to **dynamically** change the color of the slider based on the slider value. – user623396 Mar 12 '14 at 15:48
I created images with colours and now I set images. Works fine. – Michal Jurník Mar 13 '14 at 09:09
1

@MichalJuriJurník Could you post your solution? – user623396 Mar 13 '14 at 09:14

score 1 · Answer 4 · answered Mar 13 '14 at 09:29

I've created 2px images with the colour of slider track.

enter image description here

And then I set they as tracking images (here's with thumb image for iPad and iPhone)

UIImage *thumbImage = [UIImage imageNamed:@"slider"];
UIImage *trackImage;

if (isiPad) {
    [[UISlider appearance] setThumbImage:thumbImage forState:UIControlStateNormal];
    [[UISlider appearance] setThumbImage:thumbImage forState:UIControlStateHighlighted];
    trackImage = [UIImage imageNamed:@"menu-bar-ipad"];
}
else {
    [[UISlider appearance] setThumbImage:[self imageWithImage:thumbImage scaledToSize:CGSizeMake(27, 27)] forState:UIControlStateNormal];
    [[UISlider appearance] setThumbImage:[self imageWithImage:thumbImage scaledToSize:CGSizeMake(27, 27)] forState:UIControlStateHighlighted];
    trackImage = [UIImage imageNamed:@"menu-bar"];
}

[[UISlider appearance]  setMinimumTrackImage:trackImage forState:UIControlStateNormal];
[[UISlider appearance]  setMaximumTrackImage:trackImage forState:UIControlStateNormal];

And that's all. Same solution as msmq I guess. And you can see both ways how to make a large image - two images way and scaling way.

Thanks for sharing. What we are missing here is the **dynamic** factor. E.g. the slider goes from red to green based on its value. — user623396, Mar 13 '14 at 09:34
Oh sry, now I see that. If you need to have slider with one green colour and one red colour you could just change min and max track images. — Michal Jurník, Mar 13 '14 at 09:39

hbk · Answer 5 · 2015-09-13T14:32:46.213

Maybe a little bit late, but - here is the answer

You should read description of setter:

The color used to tint the standard maximum track images. Setting this property removes any custom maximum track images associated with the slider.

Also this applicable only for maximum color, because minimum setter just change titntColor:

The color used to tint the standard minimum track images.

This mean that slider use some image for maximum track and if u just set tint color nothing will be changes (nothing can't be tinted).

Solution (thanks to @user623396):

UIImage *currentSliderMaximumImage = self.slider.currentMaximumTrackImage;

CGRect rect = CGRectMake(0, 0, currentSliderMaximumImage.size.width, currentSliderMaximumImage.size.height);
UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);
[[[DynamicUIService service] currentApplicationColor] setFill];
UIRectFill(rect);
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[self.slider setMaximumTrackImage:image forState:UIControlStateNormal];

As result u will get

UISlider setMaximumTrackTintColor in iOS 7.1

5 Answers5

Linked