UIView 的边框填充答案

【问题标题】：Border Padding for a UIViewUIView 的边框填充
【发布时间】：2019-03-06 02:21:27
【问题描述】：

我在 UIView 周围创建了一个标准边框，如下所示：

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

但我希望 UIView 和它周围的边框之间有 5px 的填充/边距/间距。

现在它只是在它周围立即绘制边框。我想把它推出来，这样中间就可以留出空隙了。

有什么建议吗？我怀疑插入是要走的路，但无法弄清楚。

谢谢！

【问题讨论】：

如何尝试将您的视图包裹在另一个清晰的彩色视图中并在该视图中添加边框？

标签： ios swift uiview swift4

【解决方案1】：

插入不是要走的路。您使用 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)

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

【讨论】：

【解决方案2】：

试试这个，对你有帮助。

首先，添加这个扩展

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)

输出为：

【讨论】：

所以如果我已经有一个名为 vwGroup 的视图，那么它在您的代码中的什么位置？我想这样称呼它： vwGroup(colors:[UIColor.white,UIColor.white] , width: 10) 并且它围绕着它，但它把它作为渐变边框（并且没有间距）。
addGradientBorder 使用 vwGroup 调用此方法两次，因为第一次用于填充，第二次用于 UIView 的 border。并且不要忘记从 vwGroup 中删除默认边框宽度和边框颜色

【解决方案3】：

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)
    }
}

【讨论】：