Adjust UIImage into UIImageView

Question

Im trying to fit an image into uiimageview, the images are downloaded and loaded dinamically, and theres only one resolution available for ios and android apps.

So, i need images to keep aspect ratio and scale to width, i set UIImageView content mode to UIViewContentModeScaleAspectFill, but it centers image, so it goes out of screen for both top and bottom, images will be designed so that the bottom is unnecessary.

How can i align the image to the top-left corner?

And can UIImageView scale to width for me too? or how can i do it?

Thanks in advance.

EDIT:

I tried setcliptobounds and that cuts the image to imageview size, thats not my problem.

UIViewContentModeTopLeft is working well, but now i cant apply UIViewContentModeScaleAspectFill, or can i apply both?

Answer 1

You could scale the image to suit the image view's width.

You could use a category on UIImage that creates a new image with chosen width.

@interface UIImage (Scale)

-(UIImage *)scaleToWidth:(CGFloat)width;

@end

@implementation UIImage (Scale)

-(UIImage *)scaleToWidth:(CGFloat)width
{
    UIImage *scaledImage = self;
    if (self.size.width != width) {
        CGFloat height = floorf(self.size.height * (width / self.size.width));
        CGSize size = CGSizeMake(width, height)

        // Create an image context
        UIGraphicsBeginImageContext(size);

        // Draw the scaled image
        [self drawInRect:CGRectMake(0.0f, 0.0f, size.width, size.height)];

        // Create a new image from context
        scaledImage = UIGraphicsGetImageFromCurrentImageContext();

        // Pop the current context from the stack
        UIGraphicsEndImageContext();
    }
    // Return the new scaled image
    return scaledImage;
}

@end

This way you can use it to scale the image

UIImage *scaledImage = [originalImage scaleToWidth:myImageView.frame.size.width];
myImageView.contentMode = UIViewContentModeTopLeft;
myImageView.image = scaledImage;

Answer 2

UIView which is the superclass of UIImageView has a property contentMode. You can use the following constant for top left alignment of your image.

UIViewContentModeTopLeft

Aligns the content in the top-left corner of the view.

To keep Aspect ratio

UIViewContentModeScaleAspectFit

Scales the content to fit the size of the view by maintaining the aspect ratio. Any remaining area of the view’s bounds is transparent.

Answer 3

You can't both align and retain aspect ratio with UIImageView, However there is a great subclass of UIImageView named UIImageViewAligned that makes this possible for you. You can find this project on github from here.
What you need to do is as follows:

1. First Copy header and implementation from UIImageViewAligned-master/UIImageViewAligned/ to your project
2. Insert an ImageView object from object library in IB to your view.
3. Change class of ImageView to UIImageViewAligned in Identity Inspector from the Utilities pane
4. Then add your desired alignment as a key path in User Defined Runtime Attributes section of Identity Inspector

That's it. Run your project to make sure of it.