如何将边框添加到带有蒙版的圆形图像

这是我的尝试：

func round() { let width = bounds.width < bounds.height ? bounds.width : bounds.height let mask = CAShapeLayer() mask.path = UIBezierPath(ovalInRect: CGRectMake(bounds.midX - width / 2, bounds.midY - width / 2, width, width)).CGPath self.layer.mask = mask // add border let frameLayer = CAShapeLayer() frameLayer.path = mask.path frameLayer.lineWidth = 4.0 frameLayer.strokeColor = UIColor.whiteColor().CGColor frameLayer.fillColor = nil self.layer.addSublayer(frameLayer) } 

它可以在iphone 6模拟器上运行（storyboard的大小为4.7），但是在5s和6+上看起来很奇怪：

这是一个自动布局问题？ 没有边界，自动布局工作正确。 这是我第一次与口罩合作，所以我不确定我所做的是否正确。

在viewDidLayoutSubviews调用一个viewDidLayoutSubviews函数。

有什么想法吗？

Answer 1

例如，如果您有UIImageView子类，则可以覆盖layoutSubviews ，使其（a）更新掩码; （b）删除任何旧边界; 和（c）增加一个新的边界。 在Swift 3：

 import UIKit @IBDesignable class RoundedImageView: UIImageView { /// saved rendition of border layer private weak var borderLayer: CAShapeLayer? override func layoutSubviews() { super.layoutSubviews() // create path let width = min(bounds.width, bounds.height) let path = UIBezierPath(arcCenter: CGPoint(x: bounds.midX, y: bounds.midY), radius: width / 2, startAngle: 0, endAngle: .pi * 2, clockwise: true) // update mask and save for future reference let mask = CAShapeLayer() mask.path = path.cgPath layer.mask = mask // create border layer let frameLayer = CAShapeLayer() frameLayer.path = path.cgPath frameLayer.lineWidth = 32.0 frameLayer.strokeColor = UIColor.white.cgColor frameLayer.fillColor = nil // if we had previous border remove it, add new one, and save reference to new one borderLayer?.removeFromSuperlayer() layer.addSublayer(frameLayer) borderLayer = frameLayer } } 

这样，它响应布局的变化，但它确保清理任何旧的边界。

顺便说一下，如果你不是UIImageView ，而是把这个逻辑放在视图控制器中，你可以重写viewWillLayoutSubviews而不是UIView的layoutSubviews 。 但基本的想法是一样的。

–

顺便说一句，我使用一个面具与这个形状层相结合，因为如果你只是应用一个UIView圆angular，它可能会导致奇怪的工件（看在圆形边界下部非常细的灰线）：

如果您使用贝塞尔path方法，则不会产生这样的工件：

对于Swift 2.3的例子，请参阅此答案的早期版本 。

Answer 2

最简单的方法是操作图像视图本身的layer 。

 imageView.layer.cornerRadius = imageView.bounds.size.width / 2.0 imageView.layer.borderWidth = 2.0 imageView.layer.borderColor = UIColor.whiteColor.CGColor imageView.layer.masksToBounds = true 

您可以将其包含在viewDidLayoutSubviews或layoutSubviews ，以确保大小总是正确的。

注意：也许这种技术使你的圈子面具过时;-)。 作为一个经验法则，总是select最简单的解决scheme。