如何在UIButton上只添加TOP边框？

Question

我知道如何在iOS 7中为按钮添加边框,使用以下代码:

[[myButton layer] setBorderColor:[[[UIColor grayColor] colorWithAlphaComponent:0.5] CGColor]];
[[myButton layer] setBorderWidth:1];
[[myButton layer] setCornerRadius:15];

但是我怎样才能添加一个边框？我想只添加顶部边框.

Answer 1

UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, btn.frame.size.width, 1)];
lineView.backgroundColor = [UIColor redColor];
[btn addSubview:lineView];

你可以为每个边界做同样的事情.添加多个UIView,您可以添加底部和左侧或顶部和右侧或任何您想要的边框.

即底部和左侧:

UIView *bottomBorder = [[UIView alloc] initWithFrame:CGRectMake(0, btn.frame.size.height - 1.0f, btn.frame.size.width, 1)];
bottomBorder.backgroundColor = [UIColor redColor];

UIView *leftBorder = [[UIView alloc] initWithFrame:CGRectMake(1, 0, 1, btn.frame.size.height)];
leftBorder.backgroundColor = [UIColor redColor];

[btn addSubview:bottomBorder];
[btn addSubview:leftBorder];

如果您不使用ARC,请记住在添加子视图(或使用自动释放)后发布UIViews.

Answer 2

这是在Swift中实现的masgar解决方案:

    var lineView = UIView(frame: CGRectMake(0, 0, btn.frame.size.width, 1))
    lineView.backgroundColor=UIColor.redColor()
    btn.addSubview(lineView)

Answer 3

在Swift中为UIView类添加一个扩展,如下所示:

斯威夫特3*

extension UIView {
func addTopBorderWithColor(color: UIColor, width: CGFloat) {
    let border = CALayer()
    border.backgroundColor = color.cgColor
    border.frame = CGRect(x:0,y: 0, width:self.frame.size.width, height:width)
    self.layer.addSublayer(border)
}

func addRightBorderWithColor(color: UIColor, width: CGFloat) {
    let border = CALayer()
    border.backgroundColor = color.cgColor
    border.frame = CGRect(x: self.frame.size.width - width,y: 0, width:width, height:self.frame.size.height)
    self.layer.addSublayer(border)
}

func addBottomBorderWithColor(color: UIColor, width: CGFloat) {
    let border = CALayer()
    border.backgroundColor = color.cgColor
    border.frame = CGRect(x:0, y:self.frame.size.height - width, width:self.frame.size.width, height:width)
    self.layer.addSublayer(border)
}

func addLeftBorderWithColor(color: UIColor, width: CGFloat) {
    let border = CALayer()
    border.backgroundColor = color.cgColor
    border.frame = CGRect(x:0, y:0, width:width, height:self.frame.size.height)
    self.layer.addSublayer(border)
}
}

我从这个链接获得了这个扩展:UIView底部边界？

然后像这样调用函数

var innerView : UIView?
    let borderWidth: CGFloat = 1.0
    let borderColor : UIColor =  UIColor.redColor()
    innerView!.addTopBorderWithColor(borderColor, width: borderWidth)

对于自适应布局使用此

斯威夫特3

extension UIView {

func addTopBorder(_ color: UIColor, height: CGFloat) {
    let border = UIView()
    border.backgroundColor = color
    border.translatesAutoresizingMaskIntoConstraints = false
    self.addSubview(border)
    border.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.height,
        relatedBy: NSLayoutRelation.equal,
        toItem: nil,
        attribute: NSLayoutAttribute.height,
        multiplier: 1, constant: height))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.top,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.top,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.leading,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.leading,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.trailing,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.trailing,
        multiplier: 1, constant: 0))
}

func addBottomBorder(_ color: UIColor, height: CGFloat) {
    let border = UIView()
    border.backgroundColor = color
    border.translatesAutoresizingMaskIntoConstraints = false
    self.addSubview(border)
    border.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.height,
        relatedBy: NSLayoutRelation.equal,
        toItem: nil,
        attribute: NSLayoutAttribute.height,
        multiplier: 1, constant: height))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.bottom,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.bottom,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.leading,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.leading,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.trailing,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.trailing,
        multiplier: 1, constant: 0))
}
func addLeftBorder(_ color: UIColor, width: CGFloat) {
    let border = UIView()
    border.backgroundColor = color
    border.translatesAutoresizingMaskIntoConstraints = false
    self.addSubview(border)
    border.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.width,
        relatedBy: NSLayoutRelation.equal,
        toItem: nil,
        attribute: NSLayoutAttribute.width,
        multiplier: 1, constant: width))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.leading,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.leading,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.bottom,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.bottom,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.top,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.top,
        multiplier: 1, constant: 0))
}
func addRightBorder(_ color: UIColor, width: CGFloat) {
    let border = UIView()
    border.backgroundColor = color
    border.translatesAutoresizingMaskIntoConstraints = false
    self.addSubview(border)
    border.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.width,
        relatedBy: NSLayoutRelation.equal,
        toItem: nil,
        attribute: NSLayoutAttribute.width,
        multiplier: 1, constant: width))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.trailing,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.trailing,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.bottom,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.bottom,
        multiplier: 1, constant: 0))
    self.addConstraint(NSLayoutConstraint(item: border,
        attribute: NSLayoutAttribute.top,
        relatedBy: NSLayoutRelation.equal,
        toItem: self,
        attribute: NSLayoutAttribute.top,
        multiplier: 1, constant: 0))
}
}

用法:

button!.addTopBorder(UIColor(red: 247.0/255.0, green: 147.0/255.0, blue: 29.0/255.0, alpha: 0.5), height: borderWidth)

Answer 4

斯威夫特4

UIButton顶部边框

var lineView = UIView(frame: CGRect(x: 0, y: 0, width: button.frame.size.width, height: 2))
lineView.backgroundColor= UIColor.black
button.addSubview(lineView)

UIButton底部边框

var lineView = UIView(frame: CGRect(x: 0, y: button.frame.size.height, width: button.frame.size.width, height: 2))
lineView.backgroundColor= UIColor.black
button.addSubview(lineView)

Answer 5

只需自己绘制边框:

@implementation TopBorderButton
- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
    CGContextFillRect(context, CGRectMake(0.0f, 0.0, self.frame.size.width, 1.0));
}
@end