如何在UIButton中创建边框？

我在名为“ addButton”的应用程序中使用了自定义按钮，我想用白色作为边框，如何获得自定义按钮周围的白色边框？

您可以通过访问按钮的layer属性来设置CALayer上的border属性。

首先，添加石英

#import <QuartzCore/QuartzCore.h>

设置属性：

myButton.layer.borderWidth = 2.0f;
myButton.layer.borderColor = [UIColor greenColor].CGColor;

看到：

https://developer.apple.com/documentation/quartzcore/calayer#//apple_ref/occ/cl/CALayer

上方链接中的CALayer允许您设置其他属性，例如拐角半径，maskToBounds等。

另外，一篇关于按钮乐趣的好文章：

https://web.archive.org/web/20161221132308/http://www.apptite.be/tutorial_custom_uibuttons.php

非常简单，只需在文件中添加quartzCore头文件（为此，您必须在项目中添加quartz框架）

然后做

[[button layer] setCornerRadius:8.0f];

[[button layer] setMasksToBounds:YES];

[[button layer] setBorderWidth:1.0f];

您可以根据需要更改浮点值。

请享用。

这是一些典型的现代代码...

self.buttonTag.layer.borderWidth = 1.0f;
self.buttonCancel.layer.borderWidth = 1.0f;

self.buttonTag.layer.borderColor = [UIColor blueColor].CGColor;
self.buttonCancel.layer.borderColor = [UIColor blueColor].CGColor;

self.buttonTag.layer.cornerRadius = 4.0f;
self.buttonCancel.layer.cornerRadius = 4.0f;

这与分段控件类似。

Swift更新：

• 无需添加“ QuartzCore”

做就是了：

button.layer.cornerRadius = 8.0
button.layer.borderWidth = 1.0
button.layer.borderColor = UIColor.black.cgColor

而且，您无需导入“ QuartzCore / QuartzCore.h”

只需使用：

button.layer.borderWidth = 0.8
button.layer.borderColor = (UIColor( red: 0.5, green: 0.5, blue:0, alpha: 1.0 )).cgColor

要么

button.layer.borderWidth = 0.8
button.layer.borderColor = UIColor.grayColor().cgColor

设置图层的borderWidth和的问题borderColor是，当您触摸按钮时，边框不会激活高光效果的动画。

当然，您可以观察按钮的事件并相应地更改边框颜色，但这感觉不必要。

另一个选择是创建可拉伸的UIImage并将其设置为按钮的背景图像。您可以像这样在Images.xcassets中创建一个图像集：

然后，将其设置为按钮的背景图像：

如果您的图像是模板图像，则可以设置按钮的色彩，边框会改变：

现在，边框将在触摸时与其余按钮一起突出显示。

要更改按钮的半径，颜色和宽度，我设置如下：

self.myBtn.layer.cornerRadius = 10;
self.myBtn.layer.borderWidth = 1;
self.myBtn.layer.borderColor =[UIColor colorWithRed:189.0/255.0f green:189.0/255.0f blue:189.0/255.0f alpha:1.0].CGColor;

这是Ben Packard的答案的更新版本（Swift 3.0.1）。

import UIKit

@IBDesignable class BorderedButton: UIButton {

    @IBInspectable var borderColor: UIColor? {
        didSet {
            if let bColor = borderColor {
                self.layer.borderColor = bColor.cgColor
            }
        }
    }

    @IBInspectable var borderWidth: CGFloat = 0 {
        didSet {
            self.layer.borderWidth = borderWidth
        }
    }

    override var isHighlighted: Bool {
        didSet {
            guard let currentBorderColor = borderColor else {
                return
            }

            let fadedColor = currentBorderColor.withAlphaComponent(0.2).cgColor

            if isHighlighted {
                layer.borderColor = fadedColor
            } else {

                self.layer.borderColor = currentBorderColor.cgColor

                let animation = CABasicAnimation(keyPath: "borderColor")
                animation.fromValue = fadedColor
                animation.toValue = currentBorderColor.cgColor
                animation.duration = 0.4
                self.layer.add(animation, forKey: "")
            }
        }
    }
}

借助@IBDesignable和@IBInspectable标签，可以在StoryBoard内部使用结果按钮。

同样，定义了两个属性，您可以直接在界面构建器上设置边框的宽度和颜色，并预览结果。

可以类似的方式添加其他属性，例如边界半径和高光衰落时间。

您无需立即导入QuartzCore.h。以iOS 8 SDK和Xcode 6.1为参考。

直接使用：

[[myButton layer] setBorderWidth:2.0f];
[[myButton layer] setBorderColor:[UIColor greenColor].CGColor];

这是一个UIButton支持突出显示状态动画而不使用图像的子类。当视图的色调模式更改时，它也会更新边框颜色。

class BorderedButton: UIButton {
    override init(frame: CGRect) {
        super.init(frame: frame)

        layer.borderColor = tintColor.CGColor
        layer.borderWidth = 1
        layer.cornerRadius = 5

        contentEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 5, right: 10)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("NSCoding not supported")
    }

    override func tintColorDidChange() {
        super.tintColorDidChange()

        layer.borderColor = tintColor.CGColor
    }

    override var highlighted: Bool {
        didSet {
            let fadedColor = tintColor.colorWithAlphaComponent(0.2).CGColor

            if highlighted {
                layer.borderColor = fadedColor
            } else {
                layer.borderColor = tintColor.CGColor

                let animation = CABasicAnimation(keyPath: "borderColor")
                animation.fromValue = fadedColor
                animation.toValue = tintColor.CGColor
                animation.duration = 0.4
                layer.addAnimation(animation, forKey: "")
            }
        }
    }
}

用法：

let button = BorderedButton(style: .System) //style .System is important

出现：

这可以通过Swift 3.0中的多种方法来实现。工作于最新版本-2017年8月

选项1：

直接为UI按钮分配borderWidth属性值：

  btnUserButtonName.layer.borderWidth = 1.0

使用UI按钮的默认颜色值设置标题：

btnUserButtonName.setTitleColor(UIColor.darkGray, for: .normal)

为UI按钮的border属性值设置默认颜色边框：

btnUserButtonName.layer.borderColor = UIColor.red

为用户界面按钮的边框属性值设置用户定义的颜色：

   let myGrayColor = UIColor(red: 0.889415, green: 0.889436, blue:0.889424, alpha: 1.0 )
   btnUserButtonName.layer.borderColor = myGrayColor.cgColor

选项2：[推荐]

使用扩展方法，因此整个应用程序中的Button看起来将保持一致，而无需在每个位置重复多行代码。

//Create an extension class in any of the swift file

extension UIButton {
func setBordersSettings() {
        let c1GreenColor = (UIColor(red: -0.108958, green: 0.714926, blue: 0.758113, alpha: 1.0))
        self.layer.borderWidth = 1.0
        self.layer.cornerRadius = 5.0
        self.layer.borderColor = c1GreenColor.cgColor
        self.setTitleColor(c1GreenColor, for: .normal)
        self.layer.masksToBounds = true
    }
}

在代码中的用法：

//use the method and call whever the border has to be applied

btnUserButtonName.setBordersSettings()

扩展方法按钮的输出：

使用Swift 3更新

    button.layer.borderWidth = 0.8
    button.layer.borderColor = UIColor.blue.cgColor

****在Swift 3中****

创建边框

 btnName.layer.borderWidth = 1
 btnName.layer.borderColor = UIColor.black.cgColor

使圆角变圆

 btnName.layer.cornerRadius = 5

斯威夫特5

button.layer.borderWidth = 2

要更改边框的颜色，请使用

button.layer.borderColor = CGColor(srgbRed: 255/255, green: 126/255, blue: 121/255, alpha: 1)