Changing the size of UIStepper

Question

I can't seem to change the size of UIStepper:

1. In IB, the Width and Height boxes are grayed out.

2. I used initWithFrame:

   UIStepper *stepper = [[UIStepper alloc] initWithFrame:CGRectMake(300, 638, 120, 80)];

   But it does not change the size. Several posts on SO seemed to implied it is changeable. Any suggestion?

Answer 1

from the doc:

The bounding rectangle for a stepper matches that of a UISwitch object.

Doesn't sound, like it is possible upfront.

Also in this blog post:

// Frame defines location, size values are ignored
UIStepper *stepper = [[UIStepper alloc] initWithFrame:CGRectMake(120, 20, 0, 0)]; 

But you can try to transform it's layer.

Answer 2

UIStepper* s = [UIStepper alloc] init];  
s.transform = CGAffineTransformMakeScale(0.75, 0.75);

Answer 3

You can properly update the UIStepper size without transformation.

Use the following method to set the background image and the stepper will draw itself using the background size:

- (void)setBackgroundImage:(UIImage*)image forState:(UIControlState)state

Example

    [self.stepper1 setIncrementImage:[UIImage imageNamed:@"plusIcon1.png"] forState:UIControlStateNormal];
    [self.stepper1 setDecrementImage:[UIImage imageNamed:@"minusIcon1.png"] forState:UIControlStateNormal];

    [self.stepper1 setBackgroundImage:[UIImage imageNamed:@"stepperBkg1.png"] forState:UIControlStateNormal];
    [self.stepper1 setBackgroundImage:[UIImage imageNamed:@"stepperBkgHighlighted1.png"] forState:UIControlStateHighlighted];
    [self.stepper1 setBackgroundImage:[UIImage imageNamed:@"stepperBkgDisabled1.png"] forState:UIControlStateDisabled];

This yields the following result on the left, compared to an unmodified stepper on the right:

stepperBkg1@2x.png:

stepperBkgHighlighted1@2x.png:

Answer 4

I tried the transform on my stepper - it did change the appearance and did scale it, however, the images of the + and - were stretched (so you have to scale in proportion to the original stepper.

Also, be careful because the area of touch that actually increments and decrements, does change - so on the stretched image, the button would not decrement along the entire view - so this is probably not a good solution....

Answer 5

You can provably scale it:

stepper.transform = CGAffineTransformMakeScale(1.75, 1.0);

Answer 6

I've made a small custom UIStepper class for it. No images needed, no transformation needed. Images generated automatically. https://github.com/alelipona/VZCustomSizeStepper

Answer 7

Yes, you can change size of stepper.

first, right click on storyboard --> select (open as)--> Select (Source Code)

then find stepper in the code--> find width=??? and change.

then click on storyboard again and select open as interface builder.