In this post I will demonstrate on how to use a switch control, The switch control is just like a switch with an on and off text and one more thing you have to keep in mind before we proceed and that is the width and height of the switch will always be 94 and 27 not more than that, so let's begin
Design Phase: In this scenario when the switch displays off the label text must also change to off and when it displays on the label text must display on pretty simple right
Step 1: Open Xcode and create a window based or a view based application and give it an appropriate name, I normally am a faculty and I give the name of my projects like the control name and with the prefix demo. The name of this project that I gave was SwitchDemo. For designing we need a label and a switch control and a function with the help of which we will change the text of the label.
Step 2: Now add a UIViewController subclass file to your project and give it the name swithcdemoviewController. Select the .h file and add this piece of code to your project
@interface switchdemoviewController : UIViewController {
UILabel *lbl;
UISwitch *objSwitch;
}
-(void)changeLabelText;
@end
Now go to the .m file of the switchdemoviewController and select its init method where you will set the frame of both label and the UISwitch object here's how you will do that
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
if (self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil]) {
// Custom initialization
lbl = [[UILabel alloc]initWithFrame:CGRectMake(86, 199, 202, 21)];
lbl.text = @"Default Text";
objSwitch = [[UISwitch alloc]initWithFrame:CGRectMake(80, 122, 94, 27)];
[objSwitch addTarget:self action:@selector(changeLabelText) forControlEvents:UIControlEventValueChanged];
}
return self;
}
Into the loadView method add these objects to your view
- (void)loadView {
[super loadView];
[self.view addSubview:objSwitch];
[self.view addSubview:lbl];
}
Step 3: In this step we will give body to our function named chanegLabelText wich looks like this
-(void)changeLabelText
{
if(objSwitch.on)
{
lbl.text = @"The switch is on";
}
else
{
lbl.text = @"The Switch is off";
}
}
In the above code I have just checked a condition whether the switch is on or not and if it is on then change the label text to on else change the label text to off, all this is being done with the help of the property that the switch control has named on.
Step 4: Add this view (switchdemoviewController) to your window for that select the AppDelegate.m file of your project, my code looks like this
#import "SwitchDemoAppDelegate.h"
#import "switchdemoviewController.h"
@implementation SwitchDemoAppDelegate
@synthesize window;
- (void)applicationDidFinishLaunching:(UIApplication *)application {
// Override point for customization after application launch
switchdemoviewController *switchdemoVC = [[switchdemoviewController alloc]init];
[window addSubview:switchdemoVC.view];
[window makeKeyAndVisible];
}
Step 5: Build and Go means run the application you are all done, you will get the following output
I hope this post helped you Happy iCoding
Hi Radix,
ReplyDeleteI've been looking at your sample codes and info and they've been very helpful. I am new to programming. let alone iphone programming. I am trying to write an app in which there are switch buttons and text fields inside the tableview cells. Could you tell me how this is done?
Hi, I am glad my tutorials are helping , now for your query
ReplyDeleteThe below code will help you to add a button and a slider in the tableView, first of all I have set the frames of both the controls so that they appear to the right side of the cell.
switchControl = [[UISwitch alloc]initWithFrame:CGRectMake(200, 10, 94, 27)];
[btn setFrame:CGRectMake(200, 10, 74, 25)];
Now remember you want to add this controls (UIButton and UISlider) in the cell of the table.
The UITableViewCell class has a property called as the contentView with the help of which you can achieve this here’s a code to that (add this code in the cellForRowAtIndexPath method of the tableview Controller)
switch (indexPath.row) {
case 0:
[cell.contentView addSubview:btn];
break;
case 1:
[cell.contentView addSubview:switchControl];
break;
}
Similarly you can add the textfields and switches or any dam view in the tableview cell.....