How to not stretch an image in UIButton
IosCocoaUibuttonIos Problem Overview
I'm trying to create a custom UITableViewCell programmatically and one of the subviews of this cell is going to be a button with an image in it (a simple image of a magnifying glass). However, I want the button's image to be centered and scaled proportionately down to fit in the button and NOT to be stretched to fill the entire button. Below is my code where self refers to the custom UITableViewCell which I am placing the button into.
self.myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[self.myButton setBackgroundImage:[UIImage imageNamed: @image_name_here"] forState:UIControlStateNormal];
self.myButton.frame = CGRectMake(...//something, something)
self.myButton.imageView.contentMode = UIViewContentModeCenter;
[self.contentView addSubview:self.mySearchHelpButton];
Right now the image stretches to fill the entire button rather than scaling proportionately so that it fits nicely.
I have also tried setting the contentMode to UIViewContentModeScaleAspectFill but this doesn't seem to change anything. In fact, none of the different contentModes seem to change anything.
Ios Solutions
Solution 1 - Ios
Have you tried setImage instead of setBackgroundImage?
Solution 2 - Ios
Make sure the button is a Custom UIButton
Just using setImage: did not work for me on iOS9.
But it worked combined with myButton.imageView.contentMode = UIViewContentMode.ScaleAspectFit;
Solution 3 - Ios
In Swift...
button.imageView?.contentMode = . scaleAspectFit
Solution 4 - Ios
Storyboard
Property image.
You must define specific property in Runtime Attributes of Identity inspector – imageView.contentMode, where you set value relatively to rawValue position of enum UIViewContentMode. 1 means scaleAspectFit.
And button's alignment, in Attributes inspector:
Solution 5 - Ios
Swift 4.2
myButton.imageView!.contentMode = .scaleAspectFit
Swift earlier version
myButton.imageView!.contentMode = UIViewContentMode.scaleAspectFit
Solution 6 - Ios
Swift 4.X and 5.X
button.imageView!.contentMode = .scaleAspectFit
button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill
Solution 7 - Ios
I think you guys are missing the obvious issue. The image is too large for the button and iOS then has to guess how you want to scale it. Make sure your images are the right size and you won't have this issue. Of course this is for static images and buttons that you know the size for up-front -- not dynamic content.