How to fit an image on a uiview programmatically

Question

I added a uiview as a subview on a view controller programmatically (called contentView). I also added an image on that uiview programmatically. Every time I run the app on the iPad the image is stretched! How do I fix the image so that it fits the iPad screen but doesn't stretch the image? I know the drawInRect is what is stretching the image. So how do I fix that?

Here is my code:

UIGraphicsBeginImageContextWithOptions(self.contentView.bounds.size, self.contentView.opaque, 0.0);

[[UIImage imageNamed:@"menu image 2.JPG"] drawInRect:self.contentView.bounds];

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();  

UIImageView *imageView = [[UIImageView alloc] initWithImage:image];

[self.contentView addSubview:imageView];

Answer 1

Change code as below

UIImage *image = [UIImage imageNamed:@"menu image 2.JPG"];

UIImageView *imageView = [[UIImageView alloc] initWithImage:image];

imageView.contentMode = UIViewContentModeScaleAspectFit;

[self.contentView addSubview:imageView];

Answer 2

UIImageView has a property called contentMode which determines how the image layout is handled in the view context. contentMode is of type UIViewContentMode .

The default value is UIViewContentModeScaleToFill which stretches the image without respecting the aspect ratio. I am assuming it is the changing aspect ratio that is causing the issue.

If you wish to scale the image, but keep the aspect ratio, you have two options:

1. UIViewContentModeScaleAspectFit : This will show the image scaled to fill the view, but not clip any contents (if the aspect ratio doesn't match view size, it will show either horizontal or vertical bands)

2. UIViewContentModeScaleAspectFill : This will scale the image to fill the view entirely, without any bands - this will result in content being clipped if the image ratio doesn't match the view ratio.

To set the contentMode on the image view in Objective-C, use the following syntax:

UIImage *image = [UIImage imageNamed:@"menu image 2.JPG"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
imageView.contentMode = UIViewContentModeScaleAspectFill;
...

You should not need to use the custom context drawing for this to work anymore (thanks to Losiowaty for asking me about this).

Answer 3

I guess your self.contentView.bounds is not having the same aspect ratio as your menu image 2.JPG . For an experiment, please try looking at the menu image 2.JPG 's resolution. For example if it is 300x150, it's aspect ratio is (300/150 = 2:1) . Set your self.contentView.bounds to this aspect ratio and draw the image and check the results. It will not stretch.

Answer 4

请在您的项目中添加此单行代码

yourImage .contentMode = UIViewContentModeScaleAspectFit;