Scale UIImages height to UIImageView height

Question

I am creating an iOS app where I have images larger then my UIImageView. I want to scale these images so the image height is the same as the image view height. Instead of the images getting clipped on 2 sides it will only get clipped on one. How do I scale the UIImages? UIViewContentModeScaleAspectFit fits the longest end so the entire image is on the screen but I want it to fit the height not the longest end.

it is 100% programmatically created and yes i do see the image but it is just very large. — BDGapps, Aug 13 '13 at 17:52
What do you mean, you "want it to fit the height not the longest end"? No matter what you want the height to exactly fill the full screen, but if it gets cut off width-wise that's okay? — WendiKidd, Aug 13 '13 at 18:08
@WendiKidd yes I want it to always fill the height but it is ok if the width is cut off — BDGapps, Aug 13 '13 at 18:15

shuvo · Answer 1 · 2013-08-13T20:03:16.643

2

Try this code,

        //find out the width and height ratio of your image.
        double ratio = [UIImage imageNamed:@"Your_image.png"].size.width / [UIImage imageNamed:@"Your_image.png"].size.height;

        //determine the calculate width according the height. here height is set as 568.
        double calculatedWidth = ratio * 568;

        float xPosition = 0.0;
        //if calculated width is greater than the screen width than we need to change the starting position which was set to 0 initially.
        if (calculatedWidth > [UIScreen mainScreen].bounds.size.width)
        {
            xPosition = (calculatedWidth - [UIScreen mainScreen].bounds.size.width) * - 1;
        }

       //initiate your image view here.
        UIImageView *yourImageView = [[UIImageView alloc] initWithFrame:CGRectMake(xPosition, 0, calculatedWidth, 568)];
        yourImageView.image = [UIImage imageNamed:@"Your_image.png"];
        [self.view addSubview:yourImageView];

edited Aug 13 '13 at 20:03

answered Aug 13 '13 at 18:01

shuvo

705
5
15

i got it to fit to the screen but I want it to fit the height not the longer end. – BDGapps Aug 13 '13 at 18:06
Can you explain more? like what is your image resolution and what is the your image view's frame. And what you want actually. UIViewContentModeScaleAspectFit will always keep the resolution ratio and will fit the view accordingly. – shuvo Aug 13 '13 at 18:15
device: iphone5 image: 3000px by 2000px imageview:640px by 1136px. I want the 2000px to scale to 1136 and then the 3000 would just be larger then the screen. – BDGapps Aug 13 '13 at 18:43
Use contentMode `UIViewContentModeScaleAspectFill`, then. – Seamus Campbell Aug 13 '13 at 19:03

score 1 · Answer 2 · edited May 23 '17 at 12:06

If you want to make only the height exactly fit within the image view, you need to do a little math to find out the proper width ratio. Try this:

float maxHeight = 480.0f;   //this is the height of your container view.
float origHeight = imageView.frame.size.height;
float origWidth = imageView.frame.size.width;

//at this point we can create a proportion. 
//origHeight / origWidth = maxHeight / X (where X = the new width)
//divide the expression by maxHeight and you can solve for the new width: 
float newWidth = (origHeight / origWidth) / maxHeight;

At this point you have the size that you need to make the image; you always want the height to be whatever maxHeight is, and you've done math to find out the new width that is proportional to the original image size when height = maxHeight.

Check out this answer here on StackOverflow on how to resize UIImageViews. Pass that height and width to the function in that answer. And all should be well!

score 1 · Answer 3 · answered Aug 13 '13 at 19:35

Here's how you get what you want:

// Set image view to clip to bounds
self.imageView.clipToBounds = YES;
// Calculate aspect ratio of image
CGFloat ar1 = self.imageView.image.size.width / self.imageView.image.size.height;
// Calculate aspect ratio of image view
CGFloat ar2 = self.imageView.frame.size.width / self.imageView.frame.size.height;
// Set fill mode accordingly
if (ar1 > ar2) {
  self.imageView.contentMode = UIViewContentModeScaleAspectFill;
} else {
  self.imageView.contentMode = UIViewContentModeScaleAspectFit;
}

Scale UIImages height to UIImageView height

3 Answers3