简体   繁体   English

iOS:图像视图方面适合角半径

[英]iOS: Image view aspect fit with corner radius

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. 提前致谢。

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 etc on image view and set the received image by calling below function on the image view. 使用下面的方法获得圆角的指定半径的圆角图像,将所有上述属性应用为UIViewContentModeScaleAspectFit ,在图像视图上剪切到边界等,并通过在图像视图上调用下面的函数来设置接收的图像。

-(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];

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. 使用UIViewContentModeScaleAspectFit时,图像并不总是填充ImageView的框架,这就是您无法看到角半径的原因。

Try putting background color to the imageView and you will see that corner radius is working. 尝试将背景颜色添加到imageView,您将看到角半径正在工作。

If you want to see the round corners in any case you should use other content mode such as aspectFill or scaleToFill. 如果您想在任何情况下查看圆角,您应该使用其他内容模式,例如aspectFill或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. 另一种选择是增加放在imageView中的图像的大小或减小imageView的大小。

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;

Swift version as extension utility: Swift版本作为扩展实用程序:

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 : 用法 - 不要忘记在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)
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM