UIViewContentModeScaleAspectFill not clipping

I'm trying to draw some thumbnail images at a fixed size (100x100) using UIImageView. I've set the frame size of my image view to be 100x100, and set the contentMode to UIViewContentModeScaleAspectFill.

My understanding is that this should cause the image to be drawn at the size I set, and the image will fill the area of the image, and clip any portions of the image that are outside the size I set for the image view. However, the image is still drawn larger or smaller than the 100x100 size that I set for it.

If I set the contentMode to UIviewContentModeScaleToFill, then the image is drawn at exactly 100x100, but it's distorted to fit into those dimensions. Any ideas why the aspect fill isn't clipping as expected?

Here's my code:

_photoView = [[UIImageView alloc] initWithImage:photoImage];
_photoView.contentMode = UIViewContentModeScaleAspectFill;
[self addSubview:_photoView];

CGRect photoFrame = _photoView.frame;
photoFrame.size = CGSizeMake(100, 100);
_photoView.frame = photoFrame;

To better illustrate, here's an screenshot of what I'm seeing. The green squares are the UIView containing the UIImageView I'm working with. I've set their background color to green, and the frame of the view to 100x100. As a test, the UIImageViews are sized to 50x50. As you can see, when using the ...AspectFill, the images aren't sized to 50x50, and in some cases are offset from where I'd like them. When using ...ScaleToFill, they're sized correctly, but the image is distorted.

Can you try setting clip to bounds

[_photoview setClipsToBounds:YES];

Or directly in your Storyboard / Xib if you can :

If you want to expand your knowledge there is a really good article on how the iOS UIView stack is rendered. There is also a more in-depth article about the whole drawing pipeline.

In summary:

1. Rasterisation - All the view's content is rasterised (drawn or a offscreen pixel buffer) in coordinate space of the View's bounds. This could be image data or custom drawing (i.e. drawRect:) but subview content. This rasterisation takes into account the contentMode property.

   Anything outside of a view’s bounds is discarded.

2. Composition - The results are composited (drawn on top of each other) from subview to superviews. This uses the frame property of the subview.

   If the clipsToBounds property is YES on the superview then it will discard subview content outside of its bounds.

had the same problem and it was resolved by ticking "Clip Subviews".

The image was showing up properly for all views (3.5,4,4.7,5.5,ipad) in storyboard preview but not in the simulator.

After I ticked "Clip Subviews" the problem was resolved. :)

Checking "Clip subviews" directly in the Storyboard/Xib also worked for me.

My subviewes were resizing and I realised it was because the xib had auto layout set:

If everything fails,

do the clips to bounds in viewDidLayoutSubviews Method.

Example :

  override func viewDidLayoutSubviews() {
    
    imageProfile.layer.cornerRadius = imageProfile.bounds.size.width/2
    imageProfile.clipsToBounds = true
    imageProfile.layer.masksToBounds = true
 }