IOS - can stretch UIImageView but not UIButton?

Question

Here:

//UIImageView* stretchTest = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.png"]]; //[self addSubview:stretchTest]; UIButton *stretchTest = [UIButton buttonWithType:UIButtonTypeCustom]; [stretchTest setFrame:CGRectMake(0, 0, 400, 100)]; [stretchTest setBackgroundImage:[UIImage imageNamed:@"image.png"] forState:UIControlStateNormal]; [self addSubview:stretchTest]; stretchTest.contentStretch = CGRectMake(0.5, 0.5, 0, 0); stretchTest.contentMode = UIViewContentModeScaleToFill; CGRect frame = stretchTest.frame; frame.size.height = 300; stretchTest.frame = frame; 

Using UIImageView (commented above), the image is stretched accordingly - the rounded corners maintain the correct radius, because only the central pixel of the image is stretched.

Using UIButton, the image will not be stretched correctly. Angular radii are not supported and become ugly.

Both UIImageView and UIButton are subclasses of UIView. Why does the button change differently from the image?

Answer 1

You make assumptions about how UIButton works. It is not implemented in the same way as UIImageView. UIImageView is just a view, without subzones, and its contents are an image. UIButton is different, and the way it works is a private implementation.

If you are trying to stretch an image accordingly on a button, you should use -[UIImage stretchableImageWithLeftCapWidth:topCapHeight:] to get a UIImage that knows how to stretch it. If you want to stretch only the middle pixel, you can use something like

 UIImage *image = [UIImage imageNamed:@"image.png"]; image = [image stretchableImageWithLeftCapWidth:floorf(image.size.width/2) topCapHeight:floorf(image.size.height/2)]; 

Answer 2

A UIButton has two types of images that it can display - a foreground image and a background image. The background image for the button is supposed to replace the button's background texture. Thus, it will stretch to fill the entire background. It is assumed that the foreground image of the button will be an icon that may or may not be displayed next to text; he does not stretch. It may shrink if the frame is smaller than the image, but it will not stretch.

The foreground button and background image can be set in the code as follows:

 // stretchy [self setBackgroundImage:backgroundImage forState:UIControlStateNormal]; // not stretchy [self setImage:forgroundImage forState:UIControlStateNormal]; 

By default, the button's backgroundImage button will use scaleToFill to stretch the image. If you want the image to be stretched using attachments on the cover, you must set them on the image before assigning it backgroundImage, for example:

 UIImage *image = [UIImage imageNamed:@"bg_image.png"]; /* This assumes your image will have a 1px column and 1px row of pixels in the horizontal and vertical middle of the image that should be stretchable. If that not the case (such as asymetrical buttons) you need to adjust the caps */ image = [image stretchableImageWithLeftCapWidth:floorf(image.size.width/2) topCapHeight:floorf(image.size.height/2)]; [self setBackgroundImage:image forState:UIControlStateNormal];