iOS: Image view aspect fit with corner radius

此生再无相见时 提交于 2019-12-10 11:30:00

问题


I want to set corner radius with content mode as aspect fit using following code:

  cell.imgvAlbum.contentMode = UIViewContentModeScaleAspectFit;
  cell.imgvAlbum.clipsToBounds = YES;
  cell.imgvAlbum.layer.cornerRadius  = 5.0f;

but i am getting output only for content mode as aspect fit. I have also tried for:

  cell.imgvAlbum.layer.masksToBounds  = YES;

What to do for corner radius? Please suggest me some solution. Thanks in advance.


回答1:


Use below method to get a Rounded corner image with the specified radius for rounded corner, apply all your above properties as UIViewContentModeScaleAspectFit, clip to bounds e.t.c. on image view and set the received image by calling below function on the image view.

-(UIImage *)makeRoundedImage:(UIImage *) image
                      radius: (float) radius;
{
    CALayer *imageLayer = [CALayer layer];
    imageLayer.frame = CGRectMake(0, 0, image.size.width, image.size.height);
    imageLayer.contents = (id) image.CGImage;

    imageLayer.masksToBounds = YES;
    imageLayer.cornerRadius = radius;

    UIGraphicsBeginImageContext(image.size);
    [imageLayer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return roundedImage;
}

Call as

  UIImage *image = [self makeRoundedImage:[UIImage imageNamed:@"accept~iphone"]
                    radius: 5.0f];

  cell.imgvAlbum.contentMode = UIViewContentModeScaleAspectFit;
  cell.imgvAlbum.clipsToBounds = YES;
  cell.imgvAlbum.layer.cornerRadius  = 5.0f;

  cell.imgvAlbum.layer.masksToBounds  = YES;

  [cell.imgvAlbum setImage: image];



回答2:


When using UIViewContentModeScaleAspectFit the image isn't always filling the frame of the ImageView, and that is why you could not see the corner radius.

Try putting background color to the imageView and you will see that corner radius is working.

If you want to see the round corners in any case you should use other content mode such as aspectFill or scaleToFill. example:

cell.imgvAlbum.contentMode = UIViewContentModeScaleAspectFill;

Another option would be to increase the size of the image you put in the imageView or reduce the size of the imageView.




回答3:


UIImageView Corner Radius only Top left and Right in iOS

UIBezierPath *maskPath;
        maskPath = [UIBezierPath bezierPathWithRoundedRect:imageLayer.bounds
                                         byRoundingCorners:(UIRectCornerTopLeft|UIRectCornerTopRight)
                                               cornerRadii:CGSizeMake(10.0, 10.0)];

        CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
        maskLayer.frame = self.bounds;
        maskLayer.path = maskPath.CGPath;
        imageLayer.mask = maskLayer;



回答4:


Swift version as extension utility:

extension UIImage {

/**
 - Parameter cornerRadius: The radius to round the image to.
 - Returns: A new image with the specified `cornerRadius`.
 **/
func roundedImage(cornerRadius: CGFloat) -> UIImage? {
    let size = self.size

    // create image layer
    let imageLayer = CALayer()
    imageLayer.frame = CGRect(x: 0, y: 0, width: size.width, height: size.height)
    imageLayer.contents = self.cgImage

    // set radius
    imageLayer.masksToBounds = true
    imageLayer.cornerRadius = cornerRadius

    // get rounded image
    UIGraphicsBeginImageContext(size)
    if let context = UIGraphicsGetCurrentContext() {
        imageLayer.render(in: context)
    }
    let roundImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    return roundImage
}

Usage - don't forget to set new image back on imageView:

switch self.imageContentMode {
case .scaleAspectFit:
    // round actual image if aspect fit
    self.image = self.image?.roundedImage(cornerRadius: radius)
    self.imageView?.image = self.image

default:
    // round image view corners
    self.imageView?.roundCorners(radius: radius)
}


来源:https://stackoverflow.com/questions/30747338/ios-image-view-aspect-fit-with-corner-radius

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!