Button Border with Transparent Background in Swift

using Extension:

extension UIButton
{
 func setUpLayer(sampleButton: UIButton?) {
  sampleButton!.setTitle("GET STARTED", forState: UIControlState.Normal)
  sampleButton?.tintColor =  UIColor.whiteColor()
  sampleButton!.frame = CGRect(x:50, y:500, width:170, height:40)
  sampleButton!.layer.borderWidth = 1.0
  sampleButton!.layer.borderColor = UIColor.whiteColor().colorWithAlphaComponent(0.5).CGColor
  sampleButton!.layer.cornerRadius = 5.0

  sampleButton!.layer.shadowRadius =  3.0
  sampleButton!.layer.shadowColor =  UIColor.whiteColor().CGColor
  sampleButton!.layer.shadowOpacity =  0.3
 }

}

Usage:

  let sampleUIButton =  UIButton()
  sampleUIButton.setUpLayer(sampleUIButton)
  self.view.addSubview(sampleUIButton)

Using Swift 3, for Storyboard, just add this subclass to your project, then in the Identity Inspector, make this the class for the UIButton on your storyboard. You should then be able to adjust the boarder color and width.

@IBDesignable class CustomButton: UIButton {

 @IBInspectable var borderColor: UIColor = UIColor.white {
    didSet {
        layer.borderColor = borderColor.cgColor
    }
 }

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

 override public func layoutSubviews() {
    super.layoutSubviews()
    clipsToBounds = true
 }
}

Swift 5

Similar to @rakeshbs, but in Swift 5:

    let borderAlpha : CGFloat = 0.7
    let cornerRadius : CGFloat = 5.0

    self.frame = CGRect(x: 100, y: 100, width: 200, height: 40)
    self.setTitle("Login", for: UIControl.State.normal)
    self.setTitleColor(UIColor.white, for: UIControl.State.normal)
    self.backgroundColor = UIColor.clear
    self.layer.borderWidth = 1.0
    self.layer.borderColor = UIColor(white: 1.0, alpha: borderAlpha).cgColor
    self.layer.cornerRadius = cornerRadius

Setting the backgroundColor to clearColor makes the button transparent.
Try the code below for example. You can configure and vary the borderAlpha,cornerRadius and colours as your want.

let borderAlpha : CGFloat = 0.7
let cornerRadius : CGFloat = 5.0

button.frame = CGRectMake(100, 100, 200, 40)
button.setTitle("Get Started", forState: UIControlState.Normal)
button.setTitleColor(UIColor.whiteColor(), forState: UIControlState.Normal)
button.backgroundColor = UIColor.clearColor()
button.layer.borderWidth = 1.0
button.layer.borderColor = UIColor(white: 1.0, alpha: borderAlpha).CGColor
button.layer.cornerRadius = cornerRadius

Tags:

Uibutton

Swift