Sunday, 20 July 2014

UIStepper control tutorial






UIStepper control is provide by Apple to allow app developer's provide user's an interface to let them increment/decrement values. Suppose we have to allow user's to increase font size of our text in a diary app then we will use UIStepper control, as UIStepper has interface with ' + ' and  ' - ' buttons on it.

UIStepper Controls




Lets start our journey in learning UIStepper control. Open your .h file and and create an IBOutlet for UIStepper control and a label to display UIStepper's current value or increment/decrement value. Also create IBAction for the UIStepper control.

@interface TTViewController : UIViewController
{
    IBOutlet UIStepper *stepper;
    IBOutlet UILabel *counter;
}

-(IBAction)stepperValueChanged:(id)sender;
@end


Open your .xib file and drag an label , UIStepper to your view interface. Now connect your IBOutlet's by right click on file owner and select circle next to outlet's and drag them to respective controls. Also add stepperValueChanged action to valueChanged event of UIStepper control.

Connecting IBOutlet To label
File Owner



Set minimum and maximum values for your UIStepper control in attribute inspector pane and also set it increment or decrement value i.e step value.

Open your .m file and write definition for stepperValueChanged method written .h file. To get current value of UIStepper control, we will use value property of the control.We will assign UIStepper value to our counter label. As stepper returns double value, we will convert it to integer first and then assign it to our counter label.

#pragma mark UIStepper value Changed
-(IBAction)stepperValueChanged:(id)sender
{
    NSUInteger value = stepper.value;
    counter.text = [NSString stringWithFormat:@"%d",value];

Download source code from here UIStepper Source Code

2 comments:
Write comments
  1. Nice article and good collection of IOS resources. Thnks for sharing

    ReplyDelete
  2. thnx, you save my day

    ReplyDelete