iOS - 带有渐变，圆角，阴影的UIButton

• 创建一个Button，继承UIButton。

import UIKit

class ShadowButton: UIButton {
    // 圆角
    var cornerRadius: CGFloat = 0 {
        didSet{
            self.layer.cornerRadius = cornerRadius
            self.layer.masksToBounds = true
            // 刷新
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }
    // 渐变色
    var gradientColor: [UIColor] = [] {
        didSet{
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }

    // 阴影颜色
    var shadowColor: UIColor = .white {
        didSet{
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }

    // 阴影Offset
    var shadowOffset: CGSize = .zero {
        didSet{
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }

    // 阴影Opacity
    var shadowOpacity: Float = 0.0 {
        didSet{
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }
    
    // 阴影Radius
    var shadowRadius: CGFloat = 0.0 {
        didSet{
            self.setNeedsLayout()
            self.layoutIfNeeded()
        }
    }
    
    /// 阴影layer
    private var shadowLayer: CALayer?
    
    /// 渐变layer
    private var gradientLayer: CALayer?
    
    override init(frame: CGRect) {
        super.init(frame: frame)
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    override func draw(_ rect: CGRect) {
        if shadowLayer != nil {
            shadowLayer?.removeFromSuperlayer()
        }
        shadowLayer = CALayer()
        shadowLayer?.frame = self.frame
        shadowLayer?.cornerRadius = cornerRadius
        shadowLayer?.backgroundColor = self.backgroundColor?.cgColor
        shadowLayer?.masksToBounds = false
        shadowLayer?.shadowColor = shadowColor.cgColor
        shadowLayer?.shadowOffset = shadowOffset
        shadowLayer?.shadowOpacity = shadowOpacity
        shadowLayer?.shadowRadius = shadowRadius
        if gradientColor.count != 0{
            gradientLayer = CAGradientLayer.init(colors: gradientColor, startPoint: CGPoint.init(x: 0, y: 1), endPoint: CGPoint.init(x: 1, y: 1))
            gradientLayer?.frame = rect
            if let layer = gradientLayer {
                // 添加渐变
                self.layer.insertSublayer(layer, at: 0)
            }
        }else{
            gradientLayer?.removeFromSuperlayer()
        }
        if let layer = shadowLayer {
            self.superview?.layer.insertSublayer(layer, below: self.layer)
        }
    }
    
}

// MARK: - 渐变
extension CAGradientLayer {
    convenience init(colors: [UIColor], locations: [CGFloat]? = nil, startPoint: CGPoint, endPoint: CGPoint, type: CAGradientLayerType = .axial) {
        self.init()
        self.colors =  colors.map { $0.cgColor }
        self.locations = locations?.map { NSNumber(value: Double($0)) }
        self.startPoint = startPoint
        self.endPoint = endPoint
        self.type = type
    }

}

• 使用

        let button = ShadowButton()
        button.backgroundColor = .red
        button.setTitle("按钮", for: .normal)
        button.setTitleColor(.white, for: .normal)
        button.cornerRadius = 25
        button.shadowColor = #colorLiteral(red: 0.01568627451, green: 0.5960784314, blue: 0.7607843137, alpha: 1)
        button.shadowOpacity = 0.9
        button.shadowOffset = .zero
        button.shadowRadius = 6
        button.gradientColor = [#colorLiteral(red: 0.007843137255, green: 0.9215686275, blue: 0.4039215686, alpha: 1),#colorLiteral(red: 0.01960784314, green: 0.5411764706, blue: 0.8196078431, alpha: 1)]
        button.frame = CGRect(x: 24, y: 400, width: UIScreen.main.bounds.size.width - 48, height: 50)
        view.addSubview(button)

• 效果图

  
  
  WeChat45d71eb2eac0b1a7c84e95c7792fbc23.png