class ExampleViewController: UIViewController { lazy var btn: UIButton = { let btn = UIButton(type: .system) btn.contentEdgeInsets = UIEdgeInsets(top: 8, left: 16, bottom: 8, right: 16) btn.setTitle("Action", for: .normal) btn.layer.cornerRadius = 8.0 btn.tintColor = .white btn.backgroundColor = .red btn.addTarget(self, action: #selector(buttonAction), for: .touchUpInside) btn.tag = 1 btn.translatesAutoresizingMaskIntoConstraints = false // corner radius for top right, top left // btn.clipsToBounds = true // btn.layer.cornerRadius = 10 // btn.layer.maskedCorners = [.layerMaxXMinYCorner, .layerMinXMinYCorner] // shadow // btn.layer.shadowColor = UIColor.black.cgColor // btn.layer.shadowOffset = CGSize(width: 0.0, height: 2.0) // btn.layer.shadowRadius = 1.0 // btn.layer.shadowOpacity = 0.5 return btn }() @objc func buttonAction(sender: UIButton!) { let btnTag: UIButton = sender if btnTag.tag == 1 { print("Action") } } override func viewDidLoad() { super.viewDidLoad() view.addSubview(btn) NSLayoutConstraint.activate([ btn.centerYAnchor.constraint(equalTo: view.centerYAnchor), btn.centerXAnchor.constraint(equalTo: view.centerXAnchor) ]) } }
Add gradient
import UIKit import SnapKit class ViewController: UIViewController { lazy var btn: UIButton = { let btn = UIButton(type: .system) btn.contentEdgeInsets = UIEdgeInsets(top: 8, left: 16, bottom: 8, right: 16) btn.setTitle("Verify", for: .normal) btn.layer.cornerRadius = 8.0 btn.layer.masksToBounds = true btn.tintColor = .white btn.backgroundColor = .red btn.addTarget(self, action: #selector(onVerifyTapped), for: .touchUpInside) return btn }() override func viewDidLoad() { super.viewDidLoad() setupUI() } override func viewDidLayoutSubviews() { super.viewDidLayoutSubviews() btn.applyGradient(colours: [.systemYellow, .systemPink]) } @objc func onVerifyTapped(sender: UIButton!) { } func setupUI() { self.view.addSubview(btn) btn.snp.makeConstraints { (make) -> Void in make.top.equalTo(otpView.snp.bottom).offset(16) make.centerX.equalTo(self.view) } } } extension UIView { @discardableResult func applyGradient(colours: [UIColor]) -> CAGradientLayer { return self.applyGradient(colours: colours, locations: nil) } @discardableResult func applyGradient(colours: [UIColor], locations: [NSNumber]?) -> CAGradientLayer { let gradient: CAGradientLayer = CAGradientLayer() gradient.frame = self.bounds gradient.colors = colours.map { $0.cgColor } gradient.locations = locations gradient.startPoint = CGPoint(x: 0.0, y: 1.0) gradient.endPoint = CGPoint(x: 1.0, y: 1.0) self.layer.insertSublayer(gradient, at: 0) return gradient } }
Custom button
@IBDesignable class GradientButton: UIButton { let gradientLayer = CAGradientLayer() @IBInspectable var topGradientColor: UIColor? { didSet { setGradient(topGradientColor: topGradientColor, bottomGradientColor: bottomGradientColor) } } @IBInspectable var bottomGradientColor: UIColor? { didSet { setGradient(topGradientColor: topGradientColor, bottomGradientColor: bottomGradientColor) } } private func setGradient(topGradientColor: UIColor?, bottomGradientColor: UIColor?) { if let topGradientColor = topGradientColor, let bottomGradientColor = bottomGradientColor { gradientLayer.frame = bounds gradientLayer.colors = [topGradientColor.cgColor, bottomGradientColor.cgColor] gradientLayer.borderColor = layer.borderColor gradientLayer.borderWidth = layer.borderWidth gradientLayer.cornerRadius = layer.cornerRadius layer.insertSublayer(gradientLayer, at: 0) } else { gradientLayer.removeFromSuperlayer() } } }