一个UIView的边框填充问题

Question

我创建了一个标准的边框，围绕着我的UIView，代码如下：

 vwGroup.layer.borderColor = UIColor.yellow.cgColor
 vwGroup.layer.borderWidth = 2.0;

但是我希望在UIView和围绕它的边框之间有5像素的填充/边距/间距。

目前它只是直接绘制边框。我想要将其推出，以便之间有清晰的空间。

有什么建议吗？我怀疑插图是解决方法，但无法弄清楚。

谢谢！

- NullHypothesis

---

不妨尝试将您的视图包装在另一个清晰的颜色视图中，并在该视图中添加边框，您觉得怎么样？ - Tj3n

Answer 1

Insets并不是解决问题的方法。您可以使用inset来填充视图内部内容与其边距之间的空白。对于您所需的情况，最佳选择是将vwGroup包裹在另一个UIView中，并在包裹视图中设置边框。类似这样：

let wrappingView = UIView(frame: someFrame)
wrappingView.backgroundColor = .clear
wrappingView.layer.borderColor = UIColor.yellow.cgColor
wrappingView.layer.borderWidth = 2.0;
wrappingView.addSubview(vwGroup)

当然，这只是为了让您了解大局。您可能需要设置适当的框架/约束。

- alanpaivaa

Answer 2

Swift 5.4

用下面的方式调用：

customView.layer.innerBorder()

通过添加子层实现了它

extension CALayer {


    func innerBorder(borderOffset: CGFloat = 24.0, borderColor: UIColor = UIColor.blue, borderWidth: CGFloat = 2) {
        let innerBorder = CALayer()
        innerBorder.frame = CGRect(x: borderOffset, y: borderOffset, width: frame.size.width - 2 * borderOffset, height: frame.size.height - 2 * borderOffset)
        innerBorder.borderColor = borderColor.cgColor
        innerBorder.borderWidth = borderWidth
        innerBorder.name = "innerBorder"
        insertSublayer(innerBorder, at: 0)
    }
}

- dengST30

Answer 3

试试这个，对你会有帮助。

首先，添加这个扩展程序。

extension CALayer {
    func addGradientBorder(colors:[UIColor],width:CGFloat = 1) {
        let gradientLayer = CAGradientLayer()
        gradientLayer.frame =  CGRect(origin: CGPoint.zero, size: self.bounds.size)
        gradientLayer.startPoint = CGPoint(x:0.0, y:0.0)
        gradientLayer.endPoint = CGPoint(x:1.0,y:1.0)
        gradientLayer.colors = colors.map({$0.cgColor})

        let shapeLayer = CAShapeLayer()
        shapeLayer.lineWidth = width
        shapeLayer.path = UIBezierPath(rect: self.bounds).cgPath
        shapeLayer.fillColor = nil
        shapeLayer.strokeColor = UIColor.red.cgColor
        gradientLayer.mask = shapeLayer

        self.addSublayer(gradientLayer)
    }
}

然后添加带边框的UIView

let vwGroup = UIView(frame: CGRect(x: 50, y: 150, width: 200, height: 200))
vwGroup.backgroundColor = .red

//-- This is for padding between boarder and view -- you can set padding color ---
vwGroup.layer.addGradientBorder(colors:[UIColor.black,UIColor.black] , width: 40)

//--  This is for outer boarder -- you can also change the color of outer boarder --
vwGroup.layer.addGradientBorder(colors:[UIColor.white,UIColor.white] , width: 10)
self.view.addSubview(vwGroup)

输出为：

- Nilesh R Patel

---

如果我已经有一个名为vwGroup的视图，在你的代码中应该放在哪里？我试图像这样调用它：vwGroup（颜色：[UIColor.white,UIColor.white]，宽度：10），但它仅将其作为渐变边框（并没有间距）包围起来。 - NullHypothesis

使用addGradientBorder方法两次调用vwGroup，第一次是为了添加内边距（padding），第二次是为了设置UIView的边框（border）。不要忘记从vwGroup中删除默认的边框宽度和颜色。 - Nilesh R Patel