iOS 5 : UIStepper Control

November 2, 2011

There is a new pre-built control in iOS 5 for incrementing or decrementing a value, UIStepper. The control has two buttons aligned horizontally, one labeled with a plus (+) the other a minus (-).

One nice feature is a continuous option, wherein if the user presses and holds down either +/- button, the stepper value is incremented repeatedly. The longer the button is held down, the faster the increment will occur. Also, you can have the increment value wrap around when a range of values is specified, for example, if you set min and max to 0 and 99 respectively, when the value reaches 99, the next value will be 0 (and vice-versa).

Below is a screenshot that shows the output of the example code below:

Below is a short code example showing the various properties available in UIStepper:

  // Create a label to show the value in the stepper
  label = [[UILabel alloc] initWithFrame:CGRectMake(10, 20, 100, 30)];    
  [label setTextColor:[UIColor whiteColor]];
  [label setBackgroundColor:[UIColor clearColor]];
  [label setTextAlignment:UITextAlignmentLeft];
  [label setText: @"Quantity:"];
  [[self view] addSubview:label];
 
  // Frame defines location, size values are ignored
  UIStepper *stepper = [[UIStepper alloc] initWithFrame:CGRectMake(120, 20, 0, 0)];    
 
  // Set action target and action for a particular value changed event
  [stepper addTarget:self action:@selector(stepperPressed:) forControlEvents:UIControlEventValueChanged];
 
  // Set min and max
  [stepper setMinimumValue:0];
  [stepper setMaximumValue:99];
 
  // Value wraps around from minimum to maximum
  [stepper setWraps:YES];
 
  // If continuos (default), changes are sent for each change in stepper,
  // otherwise, change event occurs once user lets up on button
  [stepper setContinuous:NO];
 
  // To change the increment value for each step
  // (default is 1)
  [stepper setStepValue:10];

6 comments

Is there anything similar for those of us still targeting 4.1 devices other than just two buttons?

by Mark on Nov 2, 2011. Reply #

For older versions of iOS you can try this:
https://github.com/beefon/iOS-Stepper

by Richard on Nov 7, 2011. Reply #

Can we specify a range like this 0.25, 0.5, 0.75, 1.0, 2.0, 3.0, etc? I haven’t looked at the docs yet but I know I will need something like that soon.

by Brandon on Nov 22, 2011. Reply #

Brandon, you can set the step value (e.g. .25) and the minimum and maximum values.

John

by John Muchow on Nov 23, 2011. Reply #

How to connect UIstepper with textField, when i connect it increment and decrement but, i directly enter number to textfield after that try to increment by using steeper the value wil start from the stepper minimum value, i wanna to continue from the textField value. please help me.

I given like this,

-(void) stepperPressed1:(UIStepper *) sender
{
[stepper setMinimumValue:0];
[stepper setContinuous:YES];
[stepper setWraps:NO];
[stepper setStepValue:1];
txtField.text=[NSString stringWithFormat:@"%g",stepper.value];
[stepper setMaximumValue:300];
}

by Vineesh on Jan 2, 2012. Reply #

As a complete noob with iOS I was able to follow your tutorial. Thanks!

by Patrick Rauland on Feb 23, 2012. Reply #

Leave a Comment