那些遇到过的问题

如何在UIView的顶部添加边框

man*_*oon 136 xcode border objective-c uiview ios

我的问题是关于标题.

我不知道如何在特定的一侧,顶部或底部,任何一侧添加边框...... layer.border为整个视图绘制边框...

Ada*_*ite 193

我在这里考虑子类化UIView和重写drawRectoverkill.为什么不添加扩展UIView并添加边框子视图？

@discardableResult
func addBorders(edges: UIRectEdge,
                color: UIColor,
                inset: CGFloat = 0.0,
                thickness: CGFloat = 1.0) -> [UIView] {

    var borders = [UIView]()

    @discardableResult
    func addBorder(formats: String...) -> UIView {
        let border = UIView(frame: .zero)
        border.backgroundColor = color
        border.translatesAutoresizingMaskIntoConstraints = false
        addSubview(border)
        addConstraints(formats.flatMap {
            NSLayoutConstraint.constraints(withVisualFormat: $0,
                                           options: [],
                                           metrics: ["inset": inset, "thickness": thickness],
                                           views: ["border": border]) })
        borders.append(border)
        return border
    }


    if edges.contains(.top) || edges.contains(.all) {
        addBorder(formats: "V:|-0-[border(==thickness)]", "H:|-inset-[border]-inset-|")
    }

    if edges.contains(.bottom) || edges.contains(.all) {
        addBorder(formats: "V:[border(==thickness)]-0-|", "H:|-inset-[border]-inset-|")
    }

    if edges.contains(.left) || edges.contains(.all) {
        addBorder(formats: "V:|-inset-[border]-inset-|", "H:|-0-[border(==thickness)]")
    }

    if edges.contains(.right) || edges.contains(.all) {
        addBorder(formats: "V:|-inset-[border]-inset-|", "H:[border(==thickness)]-0-|")
    }

    return borders
}

    // Usage:         
    view.addBorder(edges: [.all]) // All with default arguments 
    view.addBorder(edges: [.top], color: .green) // Just Top, green, default thickness
    view.addBorder(edges: [.left, .right, .bottom], color: .red, thickness: 3) // All except Top, red, thickness 3
Run Code Online (Sandbox Code Playgroud)

使用此代码,您也无法绑定到子类,您可以将其应用于任何内容以及从中继承的所有内容UIView- 可在项目中重用,以及任何其他内容.将其他参数传递给您的方法以定义其他颜色和宽度.很多选择.

  • 这里唯一的缺点是无法调整大小. (4认同)
  • 可以使用UIView并添加自动布局约束.同样的原则. (2认同)
  • 感谢分享,我制作了一个带有自动布局约束的Objective-C版本[这里](https://gist.github.com/xingheng/a0338cc677e84eb5585681a9ab4fcb8e). (2认同)

Dan*_*Dan 92

斯威夫特版本的亚当威特的5/5/15加入令人敬畏:

extension CALayer {

  func addBorder(edge: UIRectEdge, color: UIColor, thickness: CGFloat) {

    var border = CALayer()

    switch edge {
    case .Top:
        border.frame = CGRectMake(0, 0, CGRectGetWidth(self.frame), thickness)
        break
    case .Bottom:
        border.frame = CGRectMake(0, CGRectGetHeight(self.frame) - thickness, CGRectGetWidth(self.frame), thickness)
        break
    case .Left:
        border.frame = CGRectMake(0, 0, thickness, CGRectGetHeight(self.frame))
        break
    case .Right:
        border.frame = CGRectMake(CGRectGetWidth(self.frame) - thickness, 0, thickness, CGRectGetHeight(self.frame))
        break
    default:
        break
    }

    border.backgroundColor = color.CGColor;

    addSublayer(border)
  }
}
Run Code Online (Sandbox Code Playgroud)

斯威夫特3:

extension CALayer {

    func addBorder(edge: UIRectEdge, color: UIColor, thickness: CGFloat) {

        let border = CALayer()

        switch edge {
        case .top:
            border.frame = CGRect(x: 0, y: 0, width: frame.width, height: thickness)
        case .bottom:
            border.frame = CGRect(x: 0, y: frame.height - thickness, width: frame.width, height: thickness)
        case .left:
            border.frame = CGRect(x: 0, y: 0, width: thickness, height: frame.height)
        case .right:
            border.frame = CGRect(x: frame.width - thickness, y: 0, width: thickness, height: frame.height)
        default:
            break
        }

        border.backgroundColor = color.cgColor;

        addSublayer(border)
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 为了使它工作,你需要在调用`view.layer.addBorder(...)`之前添加`view.layoutIfNeeded()`.然后它适用于Swift 3 (6认同)
  • 在更改CGRectMake签名和每个Swift 3的CGColor之后,由于某种原因,此代码无法在Swift 3上运行. (4认同)
  • 有没有运气在swift 3中实现这一点？ (2认同)

Pau*_*uls 48

对我来说最好的方法是UIView上的类别,但添加视图而不是CALayers,因此我们可以利用AutoresizingMasks来确保边框与superview一起调整大小.

- (void)addTopBorderWithColor:(UIColor *)color andWidth:(CGFloat) borderWidth {
    UIView *border = [UIView new];
    border.backgroundColor = color;
    [border setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin];
    border.frame = CGRectMake(0, 0, self.frame.size.width, borderWidth);
    [self addSubview:border];
}

- (void)addBottomBorderWithColor:(UIColor *)color andWidth:(CGFloat) borderWidth {
    UIView *border = [UIView new];
    border.backgroundColor = color;
    [border setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin];
    border.frame = CGRectMake(0, self.frame.size.height - borderWidth, self.frame.size.width, borderWidth);
    [self addSubview:border];
}

- (void)addLeftBorderWithColor:(UIColor *)color andWidth:(CGFloat) borderWidth {
    UIView *border = [UIView new];
    border.backgroundColor = color;
    border.frame = CGRectMake(0, 0, borderWidth, self.frame.size.height);
    [border setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleRightMargin];
    [self addSubview:border];
}

- (void)addRightBorderWithColor:(UIColor *)color andWidth:(CGFloat) borderWidth {
    UIView *border = [UIView new];
    border.backgroundColor = color;
    [border setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleLeftMargin];
    border.frame = CGRectMake(self.frame.size.width - borderWidth, 0, borderWidth, self.frame.size.height);
    [self addSubview:border];
}
Run Code Online (Sandbox Code Playgroud)

  • 到目前为止,这是解决此问题的最佳解决方案之一.大多数其他解决方案都不提供视图更改(以及设备旋转或拆分视图).这一个. (6认同)
  • 如何适应它以支持圆角？ (3认同)

Ale*_*ics 27

Swift 3.0

Swift 4.1

extension CALayer {

  func addBorder(edge: UIRectEdge, color: UIColor, thickness: CGFloat) {

    let border = CALayer()

    switch edge {
    case UIRectEdge.top:
        border.frame = CGRect(x: 0, y: 0, width: frame.width, height: thickness)

    case UIRectEdge.bottom:
        border.frame = CGRect(x:0, y: frame.height - thickness, width: frame.width, height:thickness)

    case UIRectEdge.left:
        border.frame = CGRect(x:0, y:0, width: thickness, height: frame.height)

    case UIRectEdge.right:
        border.frame = CGRect(x: frame.width - thickness, y: 0, width: thickness, height: frame.height)

    default: do {}
    }

    border.backgroundColor = color.cgColor

    addSublayer(border)
 }
}
Run Code Online (Sandbox Code Playgroud)

  • 当视图大小调整（例如方向改变）时，这不起作用。 (2认同)

Flu*_*imp 22

子类中的子类UIView和实现drawRect:,例如:

Objective-C的

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextMoveToPoint(context, CGRectGetMinX(rect), CGRectGetMinY(rect));
    CGContextAddLineToPoint(context, CGRectGetMaxX(rect), CGRectGetMinY(rect));
    CGContextSetStrokeColorWithColor(context, [[UIColor redColor] CGColor] );
    CGContextSetLineWidth(context, 2.0);
    CGContextStrokePath(context);
}
Run Code Online (Sandbox Code Playgroud)

斯威夫特4

override func draw(_ rect: CGRect) {

    let cgContext = UIGraphicsGetCurrentContext()
    cgContext?.move(to: CGPoint(x: rect.minX, y: rect.minY))
    cgContext?.addLine(to: CGPoint(x: rect.maxX, y: rect.minY))
    cgContext?.setStrokeColor(UIColor.red.cgColor)
    cgContext?.setLineWidth(2.0)
    cgContext?.strokePath()
}
Run Code Online (Sandbox Code Playgroud)

这会绘制一条2像素的红线作为顶部边框.你提到的所有其他变化都留给读者一个微不足道的练习.

建议使用Quartz 2D Programming Guide.

Tra*_* M. 19

所选答案的代码,以防任何人想要它.

注意:这不适用于autolayout(也就是说,将设备旋转到横向等).

首先定义厚度:

NSInteger borderThickness = 1;
Run Code Online (Sandbox Code Playgroud)

然后只需复制使用任何或所有这些来设置您想要设置的边框.

顶边框

UIView *topBorder = [UIView new];
topBorder.backgroundColor = [UIColor lightGrayColor];
topBorder.frame = CGRectMake(0, 0, myView.frame.size.width, borderThickness);
[myView addSubview:topBorder];
Run Code Online (Sandbox Code Playgroud)

底边

UIView *bottomBorder = [UIView new];
bottomBorder.backgroundColor = [UIColor lightGrayColor];
bottomBorder.frame = CGRectMake(0, myView.frame.size.height - borderThickness, myView.frame.size.width, borderThickness);
[myView addSubview:bottomBorder];
Run Code Online (Sandbox Code Playgroud)

左边界

UIView *leftBorder = [UIView new];
leftBorder.backgroundColor = [UIColor lightGrayColor];
leftBorder.frame = CGRectMake(0, 0, borderThickness, myView.frame.size.height);
[myView addSubview:leftBorder];
Run Code Online (Sandbox Code Playgroud)

右边界

UIView *rightBorder = [UIView new];
rightBorder.backgroundColor = [UIColor lightGrayColor];
rightBorder.frame = CGRectMake(myView.frame.size.width - borderThickness, 0, borderThickness, myView.frame.size.height);
[myView addSubview:rightBorder];
Run Code Online (Sandbox Code Playgroud)

Esq*_*uth 13

Swift版本:

var myView = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
myView.backgroundColor = UIColor.yellowColor() 

var border = CALayer()
border.backgroundColor = UIColor.lightGrayColor()
border.frame = CGRect(x: 0, y: 0, width: myView.frame.width, height: 0.5)

myView.layer.addSublayer(border)
Run Code Online (Sandbox Code Playgroud)

编辑:对于更新版本,请在此处查看我的回购:https: //github.com/goktugyil/EZSwiftExtensions/blob/master/Sources/UIViewExtensions.swift

看看addBorder部分

see*_*ppp 12

旧问题,但仍然缺少运行时边界调整的autolayout解决方案.

borders(for: [.left, .bottom], width: 2, color: .red)
Run Code Online (Sandbox Code Playgroud)

以下UIView扩展将仅在给定边上添加边框.如果在运行时更改边缘,边框将相应调整.

extension UIView {
    func borders(for edges:[UIRectEdge], width:CGFloat = 1, color: UIColor = .black) {

        if edges.contains(.all) {
            layer.borderWidth = width
            layer.borderColor = color.cgColor
        } else {
            let allSpecificBorders:[UIRectEdge] = [.top, .bottom, .left, .right]

            for edge in allSpecificBorders {
                if let v = viewWithTag(Int(edge.rawValue)) {
                    v.removeFromSuperview()
                }

                if edges.contains(edge) {
                    let v = UIView()
                    v.tag = Int(edge.rawValue)
                    v.backgroundColor = color
                    v.translatesAutoresizingMaskIntoConstraints = false
                    addSubview(v)

                    var horizontalVisualFormat = "H:"
                    var verticalVisualFormat = "V:"

                    switch edge {
                    case UIRectEdge.bottom:
                        horizontalVisualFormat += "|-(0)-[v]-(0)-|"
                        verticalVisualFormat += "[v(\(width))]-(0)-|"
                    case UIRectEdge.top:
                        horizontalVisualFormat += "|-(0)-[v]-(0)-|"
                        verticalVisualFormat += "|-(0)-[v(\(width))]"
                    case UIRectEdge.left:
                        horizontalVisualFormat += "|-(0)-[v(\(width))]"
                        verticalVisualFormat += "|-(0)-[v]-(0)-|"
                    case UIRectEdge.right:
                        horizontalVisualFormat += "[v(\(width))]-(0)-|"
                        verticalVisualFormat += "|-(0)-[v]-(0)-|"
                    default:
                        break
                    }

                    self.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: horizontalVisualFormat, options: .directionLeadingToTrailing, metrics: nil, views: ["v": v]))
                    self.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: verticalVisualFormat, options: .directionLeadingToTrailing, metrics: nil, views: ["v": v]))
                }
            }
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

Luc*_*ers 6

雨燕5

编译一些以前的答案并添加额外的方法以方便使用

import UIKit

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

    func addBorders(to sides: [ViewSide], in color: UIColor, width: CGFloat) {
        sides.forEach { addBorder(to: $0, in: color, width: width) }
    }

    func addBorder(to side: ViewSide, in color: UIColor, width: CGFloat) {
        switch side {
        case .top:
            addTopBorder(in: color, width: width)
        case .left:
            addLeftBorder(in: color, width: width)
        case .bottom:
            addBottomBorder(in: color, width: width)
        case .right:
            addRightBorder(in: color, width: width)
        }
    }

    func addTopBorder(in color: UIColor?, width borderWidth: CGFloat) {
        let border = UIView()
        border.backgroundColor = color
        border.frame = CGRect(x: 0, y: 0, width: frame.size.width, height: borderWidth)
        border.autoresizingMask = [.flexibleWidth, .flexibleBottomMargin]
        addSubview(border)
    }

    func addBottomBorder(in color: UIColor?, width borderWidth: CGFloat) {
        let border = UIView()
        border.backgroundColor = color
        border.frame = CGRect(x: 0, y: frame.size.height - borderWidth, width: frame.size.width, height: borderWidth)
        border.autoresizingMask = [.flexibleWidth, .flexibleTopMargin]
        addSubview(border)
    }

    func addLeftBorder(in color: UIColor?, width borderWidth: CGFloat) {
        let border = UIView()
        border.backgroundColor = color
        border.frame = CGRect(x: 0, y: 0, width: borderWidth, height: frame.size.height)
        border.autoresizingMask = [.flexibleHeight, .flexibleRightMargin]
        addSubview(border)
    }

    func addRightBorder(in color: UIColor?, width borderWidth: CGFloat) {
        let border = UIView()
        border.backgroundColor = color
        border.frame = CGRect(x: frame.size.width - borderWidth, y: 0, width: borderWidth, height: frame.size.height)
        border.autoresizingMask = [.flexibleHeight, .flexibleLeftMargin]
        addSubview(border)
    }
}
Run Code Online (Sandbox Code Playgroud)

您可以：

  1. 通过特定方法或使用通用方法单独设置每个边框，选择您的案例
  2. 设置边框数组

使用示例：

// Adding top border with 2 px in red
let myView = UIView()
myView.addBorder(to: .top, in: .red, width: 2)
Run Code Online (Sandbox Code Playgroud)

（也许您可以消除来自两个可能的可用接口的一些歧义，然后将辅助方法设为私有...我不会从那里删除它们并将每个案例移至主方法，因为在我看来，它可能会弄乱它的身体）。

eha*_*ro2 5

Swift 4.2 和自动布局

我浏览了提供的解决方案。许多基于框架 这是一个与 AutoLayout 一起使用的简单扩展 - 使用 View 而不是 Layer 以确保我们可以使用 AutoLayout - 具有 4 个约束的单个子视图

使用方法如下：

self.addBorder(.bottom, color: .lightGray, thickness: 0.5)


extension UIView {
    func addBorder(_ edge: UIRectEdge, color: UIColor, thickness: CGFloat) {
        let subview = UIView()
        subview.translatesAutoresizingMaskIntoConstraints = false
        subview.backgroundColor = color
        self.addSubview(subview)
        switch edge {
        case .top, .bottom:
            subview.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 0).isActive = true
            subview.rightAnchor.constraint(equalTo: self.rightAnchor, constant: 0).isActive = true
            subview.heightAnchor.constraint(equalToConstant: thickness).isActive = true
            if edge == .top {
                subview.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
            } else {
                subview.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true
            }
        case .left, .right:
            subview.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
            subview.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true
            subview.widthAnchor.constraint(equalToConstant: thickness).isActive = true
            if edge == .left {
                subview.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 0).isActive = true
            } else {
                subview.rightAnchor.constraint(equalTo: self.rightAnchor, constant: 0).isActive = true
            }
        default:
            break
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

归档时间：

查看次数：

119795 次

最近记录：

6 年，2 月 前
UIView底部边界？ 140
iOS:使用UIView的'drawRect:'与其图层的委托'drawLayer:inContext:' 72
CALayer:仅在一侧添加边框 62
swift标签只剩下边框 6
UITextfield borderColor和文本字段一侧的宽度 5
更多相关链接
相关归档
我可以安装多个Xcode版本吗？ 170
我可以使用哪些工具制作iPhone App截屏视频？ 42
如何更改UISearchBar + iPhone中显示的取消按钮的默认文本 26
UIBezierPath描边1px线并填充1px宽度矩形 - 不同的结果. 23
Xcode 10中的Instruments iOS AutoLayout工具在哪里？ 21
计算核心数据属性的最大值 - NSCFNumber错误 15
如何在调试器控制台中获取NSDictionary对象的值/键？ 13
应用程序在iPhone x上发布时崩溃？ 11
Xcode Swift UI测试-模拟器硬件键盘 9
iOS的LLDB的P命令不打印帧变量 8
难疑归档
使用"let"和"var"在JavaScript中声明变量有什么区别？ 4199
C#的正确版本号是多少？ 2422
为什么我的JavaScript在所请求的资源上出现"No'Access-Control-Allow-Origin'标头"错误,当Postman没有？ 2320
如何从git repo中删除文件？ 1795
C#在foreach中重用变量是否有原因？ 1631
如何使用对象作为成员循环一个普通的JavaScript对象？ 1521
如何在Git中有选择地合并或选择来自另一个分支的更改？ 1374
在Python中从文件名中提取扩展名 1167
如何使用Windows开发机器为iPhone开发？ 1161
自定义HTTP标头:命名约定 1051