IOS：创建带有圆角的 UIImage 或 UIImageView答案

【问题标题】：IOS: create a UIImage or UIImageView with rounded cornersIOS：创建带有圆角的 UIImage 或 UIImageView
【发布时间】：2011-12-04 02:06:31
【问题描述】：

是否可以创建带有圆角的UIImage 或UIImageView？因为我想将UIImage 显示在UIImageView 中，但我不知道该怎么做。

【问题讨论】：

标签： objective-c ios uiimage rounded-corners

【解决方案1】：

是的，这是可能的。
导入QuartzCore (#import <QuartzCore/QuartzCore.h>) 标头并使用UIImageView 的layer 属性。

yourImageView.layer.cornerRadius = yourRadius;
yourImageView.clipsToBounds = YES;

有关更多信息，请参阅CALayer 类参考。

【讨论】：

好的，它适用于 UIImageView，但是如果我在这个 UIImageView 中放入一个 UIImage，它就不起作用，我该如何解决？
别忘了激活clipToBounds。 yourImageView.clipsToBounds = YES;
如果 ImageView 在 scrollView 或 tableView 单元格内，clipsToBounds 会导致滚动性能不佳。
我这样测试！消耗大量内存！
我在 Swift 2.0 中使用过这段代码，它运行良好，谢谢。顺便说一句，我已将 YES 更改为 true。

【解决方案2】：

这是可能的，但我建议您创建带有圆角的透明 png 图像（蒙版），并使用 UIImageView 将其放置在您的图像上。它可能是更快的解决方案（例如，如果您需要动画或滚动）。

【讨论】：

【解决方案3】：

目标-C

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

斯威夫特 3

func makeRoundedImage(image: UIImage, radius: Float) -> UIImage {
    var imageLayer = CALayer()
    imageLayer.frame = CGRect(x: 0, y: 0, width: image.size.width, height: image.size.height)
    imageLayer.contents = image.cgImage

    imageLayer.masksToBounds = true
    imageLayer.cornerRadius = radius

    UIGraphicsBeginImageContext(image.size)
    imageLayer.render(in: UIGraphicsGetCurrentContext())
    var roundedImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    return roundedImage
}

【讨论】：

如何使图像中心部分创建纤细的曲线形状如何实现这个概念，请让我知道目标 c 语言

【解决方案4】：

uiimageview.layer.cornerRadius = uiimageview.frame.size.height/2;
uiimageview.clipToBounds = YES;

#import <QuartzCore/QuartzCore.h>

【讨论】：

这与其他答案有何不同？
@Mark uiimageview.frame.size.height/2; 是真正的宝石，可以使图像完美的圆形，一个完整的圆。
你是怎么想出uiimageview.frame.size.height/2的？你能解释一下吗？
@IdreesAshraf 这里涉及一个简单的逻辑......半高半径将从顶部中间开始到左侧中间。制作45度的弧度。因此，在 4 个侧面有这样的弧线将形成一个完美的圆形视图。
@Ans 如果我有不同宽度和高度的图像，它将失败。你可以试试..

【解决方案5】：

这里我如何将我的圆形头像设置在它的中心包含视图：

-(void)setRoundedAvatar:(UIImageView *)avatarView toDiameter:(float)newSize atView:(UIView *)containedView;
{
    avatarView.layer.cornerRadius = newSize/2;
    avatarView.clipsToBounds = YES;

    avatarView.frame = CGRectMake(0, 0, newSize, newSize);
    CGPoint centerValue = CGPointMake(containView.frame.size.width/2, containedView.frame.size.height/2);
    avatarView.center = centerValue;
}

【讨论】：

【解决方案6】：

试试这个代码圆形图像导入QuartzCore框架 简单的方法创建圆形图像

imageView.layer.backgroundColor=[[UIColor clearColor] CGColor];
imageView.layer.cornerRadius=20;
imageView.layer.borderWidth=2.0;
imageView.layer.masksToBounds = YES;
imageView.layer.borderColor=[[UIColor redColor] CGColor];

【讨论】：

【解决方案7】：

试试这个来获得图像视图的圆角并为角落着色：

imageView.layer.cornerRadius = imageView.frame.size.height/2;
imageView.layer.masksToBounds = YES;
imageView.layer.borderColor = [UIColor colorWithRed:148/255. green:79/255. blue:216/255. alpha:1.0].CGColor;
imageView.layer.borderWidth=2;

条件*：imageView的高度和宽度必须相同才能得到圆角。

【讨论】：

【解决方案8】：

# import QuartzCore framework
imageView.layer.cornerRadius=imgvwUser.frame.size.width/2;
imageView.layer.masksToBounds = YES;

imageView 的高度和宽度必须相同才能得到圆角。

【讨论】：

【解决方案9】：

// UIImageView+OSExt.h
#import <UIKit/UIKit.h>

@interface UIImageView (OSExt)
- (void)setBorder:(CGFloat)borderWidth color:(UIColor*)color;
@end

// UIImageView+OSExt.m
#import "UIImageView+OSExt.h"

@implementation UIImageView (OSExt)
- (void)layoutSublayersOfLayer:(CALayer *)layer
{
    for ( CALayer *sub in layer.sublayers )
    {
        if ( YES == [sub.name isEqual:@"border-shape"])
        {
            CGFloat borderHalf = floor([(CAShapeLayer*)sub lineWidth] * .5);
            sub.frame = layer.bounds;
            [sub setBounds:CGRectInset(layer.bounds, borderHalf, borderHalf)];
            [sub setPosition:CGPointMake(CGRectGetMidX(layer.bounds),
                                       CGRectGetMidY(layer.bounds))];
        }
    }
}

- (void)setBorder:(CGFloat)borderWidth color:(UIColor*)color
{
    assert(self.frame.size.width == self.frame.size.height);
    for ( CALayer *sub in [NSArray arrayWithArray:self.layer.sublayers] )
    {
        if ( YES == [sub.name isEqual:@"border-shape"])
        {
            [sub removeFromSuperlayer];
            break;
        }
    }

    CGFloat borderHalf = floor(borderWidth * .5);
    self.layer.cornerRadius = self.layer.bounds.size.width * .5;

    CAShapeLayer *circleLayer = [CAShapeLayer layer];
    self.layer.delegate = (id<CALayerDelegate>)self;
    circleLayer.name = @"border-shape";
    [circleLayer setBounds:CGRectInset(self.bounds, borderHalf, borderHalf)];
    [circleLayer setPosition:CGPointMake(CGRectGetMidX(self.layer.bounds),
                                         CGRectGetMidY(self.layer.bounds))];
    [circleLayer setPath:[[UIBezierPath bezierPathWithOvalInRect:circleLayer.bounds] CGPath]];
    [circleLayer setStrokeColor:color.CGColor];
    [circleLayer setFillColor:[UIColor clearColor].CGColor];
    [circleLayer setLineWidth:borderWidth];

    {
    circleLayer.shadowOffset = CGSizeZero;
    circleLayer.shadowColor = [[UIColor whiteColor] CGColor];
    circleLayer.shadowRadius = borderWidth;
    circleLayer.shadowOpacity = .9f;
    circleLayer.shadowOffset = CGSizeZero;
    }

    // Add the sublayer to the image view's layer tree
    [self.layer addSublayer:circleLayer];

    // old variant
    //CALayer *layer = self.layer;
    //layer.masksToBounds = YES;
    //layer.cornerRadius = self.frame.size.width * 0.5;
    //layer.borderWidth = borderWidth;
    //layer.borderColor = color;
}
@end

【讨论】：

看起来图像有一点点渗出边界。我不确定是否有一个简单的解决方法……
边框改进

【解决方案10】：

设置cornerRadius 和clipsToBounds 是正确的方法。但是，如果视图的大小发生变化，半径将不会更新。为了获得正确的大小调整和动画行为，您需要创建一个UIImageView 子类。

class RoundImageView: UIImageView {
    override var bounds: CGRect {
        get {
            return super.bounds
        }
        set {
            super.bounds = newValue
            setNeedsLayout()
        }
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        layer.cornerRadius = bounds.width / 2.0
        clipsToBounds = true
    }
}

【讨论】：

【解决方案11】：

使用 UIBeizerPath #Swift-3 && #imageExtension 的圆圈

class ViewController: UIViewController {
    @IBOutlet weak var imageOutlet: UIImageView!
    override func viewDidLoad() {
        super.viewDidLoad()
        let image = UIImage(named: "IMG_0001.JPG")
        if let image = image {
            let renderimage = image.imageCroppingBezierPath(path: UIBezierPath(arcCenter: CGPoint(x:image.size.width/2,y:image.size.width/2 )  , radius: 200, startAngle: 0, endAngle:  (2 * CGFloat(M_PI) ), clockwise: true) )
                imageOutlet.image = renderimage
        }
    }
}


extension UIImage {
    func imageCroppingBezierPath(path:UIBezierPath) ->UIImage {

        let frame = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)

        //Defining a graphic context  to paint on
        UIGraphicsBeginImageContextWithOptions(self.size, false, 0.0)
        //Get the current graphics context (if it exists)
        let context = UIGraphicsGetCurrentContext()
        //save the current graphic context
        context?.saveGState()
        // clipping area
        path.addClip()
        self.draw(in: frame)

        //To extract an image from our canvas
        let image = UIGraphicsGetImageFromCurrentImageContext()
        //restore graphic context
        context?.restoreGState()
        //remove current context from stack
        UIGraphicsEndImageContext()
        return image!
    }
}

【讨论】：

【解决方案12】：

layer.cornerRadius = imageviewHeight/2
layer.masksToBounds = true

【讨论】：