UIStepper size of decrement and increment images

Question

With iOS 6 you can now choose your own increment and decrement images using the setIncrementImage: and setDecrementImage: methods. (Check it out on RayWenderlich for a super quick example).

However I don't know what dimensions these images should have. I've tried 44x44 points (i.e. 44x44 and 88x88 pixels for normal and retina) but that leaves the images stretched.

The UIStepper control itself has a 97 point width and 27 point height. However each of the images doesn't quit cover the whole half-area (I have tried with all black images).

Does anyone know the exact dimensions the increment and decrement images should be? Or how to measure point/pixel distances in the iOS simulator?

Thank you.

UPDATE

In response to ACB's comment:

Using the following to get the default image sizes..

NSLog([NSString stringWithFormat:@"Decrement image size: width: %f, height: %f", [self.myStepper decrementImageForState:UIControlStateNormal].size.width, [self.myStepper decrementImageForState:UIControlStateNormal].size.height]);
NSLog([NSString stringWithFormat:@"Increment image size: width: %f, height: %f", [self.myStepper incrementImageForState:UIControlStateNormal].size.width, [self.myStepper incrementImageForState:UIControlStateNormal].size.height]);

Reveals that the default decrement symbol is 13x4 points, and the default increment symbol is 13x14 points.

A quick check using a 13x4 point image as a custom decrement symbol works as expected (that is the new symbol displays with same size as original). This leads me to conclude that custom images used are left in their original size, unless it is necessary to scale them down - during which they become distorted.

Answer 1

Adding my comment as answer, since that helped in solving the question.

In your project, check the size of image returned by - (UIImage *)decrementImageForState:(UIControlState)state method of UIStepper. That should give the size of default one. something like [stepper decrementImageForState:UIControlStateNormal].size.

Answer 2

You can update the UIStepper size and therefore set any size increment and decrement images.

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: