Option Set – A time and cost saving Radio button Group for iOS App Development

Contributed by Swathi V on 27 Dec 2013

• 
• Tweet
• Get in Touch

In iOS application development, there are no predefined UI Controls to create radio button-set. Instead, we only have UISegmentControl.
Hence, for a typical client requirement where the application UI needs to be similar across multiple mobile platforms, it becomes an added effort on the iOS programmers’ part to create radio button set.

We have developed a simple reusable code to address this issue.

Radio button group, Option Set (as we say it), combines multiple radio buttons within a single panel and ensures that only one button in the group is selected at any given time and remaining buttons are disabled.

The integration and implementation steps for iOS developers are explained as below.

Step - 1:
Create a class named ‘Optionset’ as subclass of UIView.

Step 2:
In the interface class (Optionset.h), add the below code:

#import <UIKit/UIKit.h>
@interface DGOptionSet : UIView{
__weak id delegate;
SEL dgSelector;

}
@property (nonatomic,assign)NSInteger selectedOptoin;

- (void)addOptionButtons:(NSArray *)buttons selectedButton:(int)selected;
- (void)addOptionButtons:(NSArray *)buttons selectedButton:(int)selected withContext:(NSDictionary *)context spacing:(int)spacing;

- (void)addTarget:(id)target action:(SEL)selector;
- (void)setOptionSelected:(int)selectedOption;
- (void)setFrame:(CGRect)frame ofButtonIndex:(NSInteger)buttonIndex;
@end

Step 3:
In the implementation class (Optionset.m), add the below code:

#import “OptionSet.h”
@implementation DGOptionSet
- (void)addOptionButtons:(NSArray *)buttons selectedButton:(int)selected {
// This method is used to specify which buttons would be in the group
}
- (void)addOptionButtons:(NSArray *)buttons selectedButton:(int)selected withContext:(NSDictionary *)context spacing:(int)spacing {
// This method can be used when user needs different styles for the selected and the unselected buttons in the group.
}
- (void)addTarget:(id)target action:(SEL)selector{
// To set the default action whenever button is clicked
}
- (void)setSelectedDGOption:(DGOPtionButton *)selectedButton{
// To set the default selected button in the group
}
- (void)setFrame:(CGRect)frame ofButtonIndex:(NSInteger)buttonIndex{
// To set the frame for each button, to arrange the buttons either horizontally or vertically
}

Step 4:
In the view controller, create an instance object of Optionset class and set the properties such as label value of the radio buttons, horizontal or vertical layout and finally, add it to UI view.

CGRect rect=CGRectMake(10, 0, 300, 100);
OptionSet *dgOptionSet=[[DGOptionSet alloc] initWithFrame:rect];
[dgOptionSet addOptionButtons:[NSArray arrayWithObjects:@"iPhone",@"iPad",@”iTouch”, nil]
selectedButton:1 withContext:nil spacing:100];
[dgOptionSet addTarget:self action:@selector(dgOptionAction:)];
dgOptionSet.frame = rect;
[self.view addSubview:dgOptionSet];

This saves time and effort during application development.
We also provide an option to the developer to configure the radio buttons to be displayed either horizontally or vertically.
Hope this makes the job of fellow iOS developers like me easier.

Visit us at Neevtech.com to know more about our offerings.

Tags: Application Development, class, implementation class, iOS, iOS App Development, iOS developer, iOS programmer, Option Set, Radio button, subclass, UI, UI Control, UI view, UISegmentControl, UIView, View Controller