How to change UISwitch default color for OFF state?

Question

I want to change the color of onTintColor in the UISwitch for the off State. The switch is in tableview and switch is made programmatically.

    [settingsSwitch setBackgroundColor:[UIColor whiteColor]];
    [settingsSwitch setTintColor:[UIColor whiteColor]];
    [settingsSwitch setThumbTintColor:[UIColor redColor]];
    [settingsSwitch setOnTintColor:[UIColor colorWithRed:138/256.0  green:9/256.0 blue:18/256.0 alpha:1]];

enter image description here

This is the result i get when i set the background color white.

enter image description here

And without background i get red color which is the color of my cell.

enter image description here

and this is the result i want, when switch is on the onTintColor should b dark red, and in off state it should be white.

i tried setting the image on switch with this line of code

[settingsSwitch setOnImage:[UIImage imageNamed:@"on.png"]];
[settingsSwitch setOffImage:[UIImage imageNamed:@"off.png"]];

But its not changing the images. i want to change the color of switch in off state. Hope i have explained my question clearly.thanks for helping in advance.

Not sure if that is a good idea. It looks like the on switch is off. And the off switch looks like it's on. (Because it has a bright, white, active looking color). — Marc, Sep 02 '14 at 06:29

score 6 · Answer 1 · answered Sep 02 '14 at 06:44

6

You can use following CODE to fulfill requirement.

Your ViewDidLoad

- (void)viewDidLoad
{
    [super viewDidLoad];

    // Do any additional setup after loading the view, typically from a nib.

    [self.view setBackgroundColor:[UIColor redColor]];

    settingsSwitch.layer.cornerRadius = 16.0; // you must import QuartzCore to do this


    if (settingsSwitch.on) {
        NSLog(@"If body ");
        [settingsSwitch setThumbTintColor:[UIColor redColor]];

        [settingsSwitch setBackgroundColor:[UIColor whiteColor]];
        [settingsSwitch setOnTintColor:[UIColor whiteColor]];

    }else{
        NSLog(@"Else body ");

        [settingsSwitch setTintColor:[UIColor clearColor]];

        [settingsSwitch setThumbTintColor:[UIColor redColor]];

        [settingsSwitch setBackgroundColor:[UIColor colorWithRed:138/256.0 green:9/256.0 blue:18/256.0 alpha:1]];
    }
}

Method where status change IBAction is called.

- (IBAction)switchStatusChange:(UISwitch *)sender
{
    if (sender.on) {
        NSLog(@"If body ");
        [sender setThumbTintColor:[UIColor redColor]];

        [sender setBackgroundColor:[UIColor whiteColor]];
        [sender setOnTintColor:[UIColor whiteColor]];

    }else{
        NSLog(@"Else body ");

        [sender setTintColor:[UIColor clearColor]];

        [sender setThumbTintColor:[UIColor redColor]];

        [sender setBackgroundColor:[UIColor colorWithRed:138/256.0 green:9/256.0 blue:18/256.0 alpha:1]];
    }
}

answered Sep 02 '14 at 06:44

Chatar Veer Suthar

15,541
26
90
154

This actually works, but it screws with the thumb animation (to left or right). Any workarounds? – Legoless Oct 02 '14 at 07:14
how could we make it smooth – Nischal Hada Jul 16 '15 at 15:59
it works but not giving smooth animation. any way to solve this? Veer bro. – MRizwan33 Mar 20 '18 at 11:10
2

@MRizwan33 try wrapping in dispatch queue main async – Nov 22 '18 at 03:13
@DaniSpringer (Y) – Nabeel Ahmed Nov 22 '18 at 07:29
@NabeelAhmed what? – Nov 22 '18 at 07:31
@DaniSpringer " try wrapping in dispatch queue main async" Its works for me thumbs up fro you :) – Nabeel Ahmed Nov 22 '18 at 12:02
1

@NabeelAhmed ok awesome! Yeah always update UI on main thread. User shouldn't have to deal with unresponsive interface. – Nov 23 '18 at 05:58

score 4 · Answer 2 · edited May 23 '17 at 10:31

4

You can use you first approach + add border radius to remove unwanted corners:

slider.backgroundColor = [UIColor whiteColor];
slider.layer.cornerRadius = 18.0;

Originally from this answer.

edited May 23 '17 at 10:31

Community

1
1

answered Jul 19 '15 at 21:23

Pavlo Razumovskyi

764
9
15

cornerRadius affect in the border corner, its a poor solution – Learn Swift Aug 24 '16 at 21:53

score 1 · Answer 3 · edited May 23 '17 at 10:31

1

corner in UISwitch cut the view, and isn't see rounded, the best answer is here https://stackoverflow.com/a/38564168/6609238

edited May 23 '17 at 10:31

Community

1
1

answered Aug 24 '16 at 21:55

Learn Swift

570
5
15

How to change UISwitch default color for OFF state?

3 Answers3

Linked