How to create an On/Off UISwitch programmatically

This is one of the most easy objects to create programmatically. The UISwitch object is that famous ON/OFF switch that you can use in your in-app settings or in some editing screen.

ON/OFF UISwitch allows you to give the user the control to enable/disable functionalities, show/hide objects or even purchase to activate in-app purchases.

Follow the directions below and download the source code (link at the bottom of the post) to create your own UISwitch object.

Don’t want to see the whole explanation? Click here and scroll to the full final code.

To create a UISwitch via code you first have to:

UISwitch *mySwitch = [[UISwitch alloc] initWithFrame:CGRectMake(130, 235, 0, 0)];

Instantiate and initialize the object with the single initWithFrame: method. The CGRectMake is what creates and position the element on the screen. CGRectMake receives four parameters, the first two are the X and Y position, the last two are the Width and Height sizes of the element.

In this example I’m only using the first two to position the element in the screen because the UISwitch object is not resizable, so it doesn’t matter what number you put in the Width and Height parameters, it’s not going to change anything.

The next step is to set what action is going to be executed when the switch is used, to do that you can add the following code:

[mySwitch addTarget:self action:@selector(changeSwitch:) forControlEvents:UIControlEventValueChanged];

With this code, I’m telling that mySwitch is going to execute the function changeSwitch: once the value (on/off) is changed.

The final step before working on the function that will run the actions when the switch is changed, is to add the element in the screen, and to do that you just need to do:

[self.view addSubview:mySwitch];

That’s it, with this, your UISwitch will be added to your view.

Now we need to create the function that will execute the actions for each of the UISwitch states. and to do that you can write:

- (void)changeSwitch:(id)sender{
    if([sender isOn]){
      // Execute any code when the switch is ON
      NSLog(@"Switch is ON");
    } else{
      // Execute any code when the switch is OFF
      NSLog(@"Switch is OFF");
    }
}

The changeSwitch function receives the UISwitch object as (id)sender, that’s why in the selector above there is the colon (:) after the function name, that means that you are passing the UISwitch object to the function, and with that object you can make your verifications.

With that in mind, the sender object is the UISwitch and to see if the switch is on or off we check the [sender isON] method. It will return TRUE if it’s ON and FALSE if it’s OFF.

And that is all, below is the full code and the link to download the working project demo.

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.

    UISwitch *mySwitch = [[UISwitch alloc] initWithFrame:CGRectMake(130, 235, 0, 0)];
    [mySwitch addTarget:self action:@selector(changeSwitch:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:mySwitch];

}

- (void)changeSwitch:(id)sender{

    if([sender isOn]){
        NSLog(@"Switch is ON");
    } else{
        NSLog(@"Switch is OFF");
    }

}

To download the source code, click on the button bellow

Do you have any questions, comments, compliments? hit the comments below.

Thanks

.gm.