Button with background image - iPhone 5 resize issue

Question

I have been looking everywhere on here and Google, but I still have this weird issue that I can't figure. I have an app pictures below, with 4 UIButtons that have a background image applied:

When I resize/run on the iPhone 5, the top button resizes in a very strange way:

How do I get all the UIButtons to resize the same way with the iPhone 5? Is it possible? Do I need to use a different method?

I really hope this is not a duplicate, but I am completely stumped. If I change the UIButtons around in other positions along the UIView, a different one will resize, or strange gap spacing will show up.... I don't understand. Thanks for any help!

EDIT: I am using iOS 6 on Xcode 4.5. I am testing on an iPhone 4S and an iPhone 5. I have AutoLayout checked. If I use Pin (just found it) I can get the UIButton to keep its height.

To clarify my question. I want the UIButtons to resize so they occupy the same percentage of the screen.... I want the proportions to be the same, instead of simply adding a bunch of empty space. I hope that make it more clear

Answer 1

One of the features you can use is called AutoLayout. Its provided with Xcode to make it easier adjusting things for the 4 inch screen. You can find a good example here: http://www.raywenderlich.com/20881/beginning-auto-layout-part-1-of-2

But as far as I know AutoLayout works only with iOS 6 which makes it "not so useful yet". I have been using a class called UIDevice, source of which can be found here: https://github.com/erica/uidevice-extension and check if the platform type is iPhone 5. I have it set up in a method which setups GUI when the view loads. Example of my implementation:

UIImage *backgroundImage;

if ([[UIDevice currentDevice] platformType] == UIDevice5iPhone)
{
    //I have a 4 inch screen present
    myButton.frame = CGRectMake(x, y, w, h); //Set the frame as you would like it to look on the iPhone 5

    backgroundImage = [[UIImage alloc] initWithCGImage:[UIImage imageNamed:@"main_background-568h@2x"].CGImage scale:2.0 orientation:UIImageOrientationUp];
}
else
{
    //I have a 3.5 inch screen present
    myButton.frame = CGRectMake(x, y, w, h); //Set the frame as you would like it to look on the iPhone 3, 3gs, 4, 4s...

    backgroundImage = [[UIImage imageNamed:@"main_background"] retain];
}
self.view.backgroundColor = [UIColor colorWithPatternImage:backgroundImage];
[backgroundImage release];

Hope it clears a bit.