Question

我可以用这种方式为CALayer添加边框：

[webView.layer setBorderColor: [[UIColor colorWithRed:0.6 green:0.7 blue:0.2 alpha:1] CGColor]];
[webView.layer setBorderWidth: 2.75];

但是有可能只在一侧添加边框吗？我只需要底部的边框。或者我可以使用其他属性来达到此目的，例如frame，bounds，mask，...？

enter image description here

感谢您的帮助！

@控制-V

        UIWebView *webView = [[UIWebView alloc] init];
        CALayer *webViewLayer = webView.layer;

        // now you can do a lot of stuff like borders:
        [webViewLayer setBorderColor: [[UIColor greenColor] CGColor]];
        [webViewLayer setBorderWidth: 2.75];

查看CALayer文档： https://developer.apple.com/documentation/quartzcore/calayer

看看这里： http://iosdevelopertips.com/cocoa/add-rounded-corners-and-border-to-uiwebview.html

Answer 1

我用这个做了一个右边框：

leftScrollView.clipsToBounds = YES;

CALayer *rightBorder = [CALayer layer];
rightBorder.borderColor = [UIColor darkGrayColor].CGColor;
rightBorder.borderWidth = 1;
rightBorder.frame = CGRectMake(-1, -1, CGRectGetWidth(leftScrollView.frame), CGRectGetHeight(leftScrollView.frame)+2);

[leftScrollView.layer addSublayer:rightBorder];

Answer 2

最简单的方法是添加一个将绘制选择性边框的subLayer，但是在选择此解决方案时需要考虑一些事项，最大的方法是确保边框subLayer始终位于顶部，并且边框会在你改变了图层的框架。

我实施了一个解决这些问题的开源解决方案，并允许您声明这样的选择性边框：

myView.borderDirection = AUIFlexibleBordersDirectionRight | AUIFlexibleBordersDirectionTop;

您可以获取代码，然后再阅读here

Answer 3

border属性始终为视图的4个边添加边框。您可以使用自己的绘制方法在视图底部绘制边框。

但是，为什么不在UIWebView上方添加一个视图使其看起来像边框？

Answer 4

我的快速解决方案。它涉及四个不同的功能，UIView的所有扩展。每个函数都添加了不同的边框。

extension UIView {
@discardableResult func addRightBorder(color: UIColor, width: CGFloat) -> UIView {
    let layer = CALayer()
    layer.borderColor = color.cgColor
    layer.borderWidth = width
    layer.frame = CGRect(x: self.frame.size.width-width, y: 0, width: width, height: self.frame.size.height)
    self.layer.addSublayer(layer)
    return self
    }
@discardableResult func addLeftBorder(color: UIColor, width: CGFloat) -> UIView {
    let layer = CALayer()
    layer.borderColor = color.cgColor
    layer.borderWidth = width
    layer.frame = CGRect(x: 0, y: 0, width: width, height: self.frame.size.height)
    self.layer.addSublayer(layer)
    return self
    }
@discardableResult func addTopBorder(color: UIColor, width: CGFloat) -> UIView {
    let layer = CALayer()
    layer.borderColor = color.cgColor
    layer.borderWidth = width
    layer.frame = CGRect(x: 0, y: 0, width: self.frame.size.width, height: width)
    self.layer.addSublayer(layer)
    return self
    }
@discardableResult func addBottomBorder(color: UIColor, width: CGFloat) -> UIView {
    let layer = CALayer()
    layer.borderColor = color.cgColor
    layer.borderWidth = width
    layer.frame = CGRect(x: 0, y: self.frame.size.height-width, width: self.frame.size.width, height: width)
    self.layer.addSublayer(layer)
    return self
    }
}

Answer 5

这是快速的等价物

leftScrollView.clipsToBounds = true
let rightBorder: CALayer = CALayer()
rightBorder.borderColor = UIColor.darkGrayColor().CGColor
rightBorder.borderWidth = 1
rightBorder.frame = CGRectMake(-1, -1, CGRectGetWidth(leftScrollView.frame), CGRectGetHeight(leftScrollView.frame)+2)
leftScrollView.layer.addSublayer(rightBorder)

Answer 6

还有另一种方法。 CAShapeLayer具有名为＆＃34; strokeStart＆＃34;的属性和＆＃34; strokeEnd＆＃34;。考虑到从0开始，当它到达原点时从1结束，从而完成路径，你可以设置值开始和结束以在一侧绘制边框。

开始描绘路径的相对位置。动画。此属性的值必须在0.0到1.0的范围内。此属性的默认值为0.0。结合strokeEnd属性，此属性定义笔划路径的子区域。此属性中的值表示沿strokeEnd属性定义结束点时开始描边的路径的相对点。值0.0表示路径的开头，而值1.0表示路径的结尾。中间的值沿路径长度线性解释。

示例：

let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
let mask = CAShapeLayer()
mask.path = path.CGPath
mask.strokeColor = UIColor.redColor().CGColor
mask.strokeStart = 0.45
mask.strokeEnd = 0.92
self.layer.mask = mask

Answer 7

以下内容与Swift 4.2一起沿现有UIView应用边框。

extension UIView {
    enum Side {
        case top
        case bottom
        case left
        case right
    }

    func addBorder(to side: Side, color: UIColor, borderWidth: CGFloat) {
        let subLayer = CALayer()
        subLayer.borderColor = color.cgColor
        subLayer.borderWidth = borderWidth
        let origin = findOrigin(side: side, borderWidth: borderWidth)
        let size = findSize(side: side, borderWidth: borderWidth)
        subLayer.frame = CGRect(origin: origin, size: size)
        layer.addSublayer(subLayer)
    }

    private func findOrigin(side: Side, borderWidth: CGFloat) -> CGPoint {
        switch side {
        case .right:
            return CGPoint(x: frame.maxX - borderWidth, y: 0)
        case .bottom:
            return CGPoint(x: 0, y: frame.maxY - borderWidth)
        default:
            return .zero
        }
    }

    private func findSize(side: Side, borderWidth: CGFloat) -> CGSize {
        switch side {
        case .left, .right:
            return CGSize(width: borderWidth, height: frame.size.height)
        case .top, .bottom:
            return CGSize(width: frame.size.width, height: borderWidth)
        }
    }
}

您可以通过以下方式调用它：

myView.addBorder(to: .left, color: .black, borderWidth: 2.0)

发生了什么事

用户提供枚举中定义的Side以及color和borderWidth
创建了一个新的subLayer，并为其指定了borderColor和borderWidth
计算出原点，由侧面确定
计算尺寸，也由侧面确定
最后，给该层一个框架，然后将其添加为子层

CALayer：仅在一侧添加边框

7 个答案: