Using a Button As A Toggle

In this example, we will see how to make a UIButton control behave as a two – state toggle switch.
Even though the iOS control palette contains a YES / NO switch, sometimes it’s nice to have a choice
of controls that is capable of performing the same function. Let’s see how it works.

Start up Xcode and select “Create a New Xcode Project.” Choose the Single View Application template
and click Next. Name the project ToggleButton, and make the project choices as shown below. Note
that in this application we are not using a storyboard, but this makes no difference.

Choose a location to save the file, and click Create.

Once the files are created, in the Project Navigator, select the ViewController.xib file. Select the view
object in the Interface Builder, and give it a nice background color, as shown on the next page:


Drag a Round Rect Button from the Object Library to the view. Set the Title attribute of the button to
be “Color On” as shown:


Now we’re going to provide an action method in the View Controller to respond to the user’s touching
the button. In the Project Navigator, select the ViewController.h file.
Make the changes as shown in bold:

 

#import
@interface ViewController : UIViewController
@property (strong, nonatomic) UIColor *activeViewColor;
- (IBAction)buttonTouched:(UIButton *)sender;
@end

 

 

Now, open up ViewController.m. First, we want to @synthesize the activeViewColor property. Second,
we need to implement the buttonTouched: method. Third, we must capture the starting color of the
view in the viewDidLoad method. Make the bolded changes to ViewController.m, as shown here:

 

}
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.activeViewColor = self.view.backgroundColor;
}
- (void)viewDidUnload
{
[super viewDidUnload];
// Release any retained subviews of the main view.
}
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);
}
@end

 

 

The last step is to wire up the action method to the button. Return to the ViewController.xib file, and
right-click the File’s Owner object. Drag from the circle to the right of the buttonTouched: method to
the button in the view. In the pop-up window, select “Touch Up Inside” to denote that we want to action
to execute when the user raises their finger while still inside the bounds of the button. Build and run the
application, and test the action of your new toggle button!

Leave a Comment:

2 comments
Using a Button as a Toggle | iPhone / iPod / iPad Software developing says April 28, 2012

[…] iPhone Tutorial | iPhone iOS4 iPad SDK Development & Programming Blog This entry was posted in IOS Development and tagged Button, Toggle, Using by sniuff. Bookmark the permalink. […]

Reply
Himanshu says January 31, 2013

Followed the steps above but got the following exception:

2013-01-31 22:53:00.593 HelloWorld2[3366:c07] *** Terminating app due to uncaught exception ‘NSUnknownKeyException’, reason: ‘[ setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key view.’
*** First throw call stack:
(0x1c94012 0x10d1e7e 0x1d1cfb1 0xb7de41 0xaff5f8 0xaff0e7 0xb29b58 0x233019 0x10e5663 0x1c8f45a 0x231b1c 0x2338da 0x1568b 0x159a2 0x14876 0x25cb5 0x26beb 0x18698 0x1befdf9 0x1c17f3f 0x1c1796f 0x1c3a734 0x1c39f44 0x1c39e1b 0x1417a 0x15ffc 0x23fd 0x2325)
libc++abi.dylib: terminate called throwing an exception

Can you help?

Reply
Add Your Reply