如何制作具有透明背景的椭圆/圆形 UIImage? [英] How to make an ellipse/circular UIImage with transparent background?

问题描述

这是我正在使用的代码

extension UIImage {        
    var ellipseMasked: UIImage? {
        guard let cgImage = cgImage else { return nil }
        let rect = CGRect(origin: .zero, size: size)

        return UIGraphicsImageRenderer(size: size, format: imageRendererFormat)
            .image{ _ in
                UIBezierPath(ovalIn: rect).addClip()
                UIImage(cgImage: cgImage, scale: scale, orientation: imageOrientation)
            .draw(in: rect)
        }
    }
}

这是我得到的图像

背景颜色为黑色.如何使背景透明?我尝试了不同的方法，但还没有让它起作用.

The background color is black. How can I make the background transparent? I tried different ways but haven't made it work yet.

推荐答案

你可以子类化 UIImageView 并屏蔽它的 CALayer 而不是剪裁图像本身:

You can subclass UIImageView and mask its CALayer instead of clipping the image itself:

extension CAShapeLayer {
    convenience init(path: UIBezierPath) {
        self.init()
        self.path = path.cgPath
    }
}

<小时>

class EllipsedView: UIImageView {
    override func layoutSubviews() {
        super.layoutSubviews()
        layer.mask = CAShapeLayer(path: .init(ovalIn: bounds))
    }
}

<小时>

let profilePicture = UIImage(data: try! Data(contentsOf: URL(string:"http://i.stack.imgur.com/Xs4RX.jpg")!))!
let iv = EllipsedView(image: profilePicture)

<小时>

编辑/更新

如果您需要剪辑 UIImage 本身，您可以按如下方式进行:

If you need to clip the UIImage itself you can do it as follow:

extension UIImage {
    var ellipseMasked: UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        defer { UIGraphicsEndImageContext() }
        UIBezierPath(ovalIn: .init(origin: .zero, size: size)).addClip()
        draw(in: .init(origin: .zero, size: size))
        return UIGraphicsGetImageFromCurrentImageContext()
    }
}

对于 iOS10+，您可以使用 UIGraphicsImageRenderer.

For iOS10+ you can use UIGraphicsImageRenderer.

extension UIImage {
    var ellipseMasked: UIImage {
        let rect = CGRect(origin: .zero, size: size)
        let format = imageRendererFormat
        format.opaque = false
        return UIGraphicsImageRenderer(size: size, format: format).image{ _ in
            UIBezierPath(ovalIn: rect).addClip()
            draw(in: rect)
        }
    }
}

<小时>

let profilePicture = UIImage(data: try! Data(contentsOf: URL(string:"http://i.stack.imgur.com/Xs4RX.jpg")!))!
profilePicture.ellipseMasked

这篇关于如何制作具有透明背景的椭圆/圆形 UIImage?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！