Как установить цвет градиента для UIButton в фоновом режиме?

Question

Я пытаюсь установить CAGradientLayer для UIButton.

Но это не совсем точно.я делаю что-то не так?

получаю вывод как

Вывидно, что есть какая-то горизонтальная линия

Вот код , который я пробовал

let topColor = UIColor(red: 0.62, green: 0.38, blue: 1, alpha: 1).cgColor
let bottomColor = UIColor(red: 0.87, green: 0.51, blue: 0.93, alpha: 1).cgColor
let gradientLayer = CAGradientLayer()
gradientLayer.frame = myButton.bounds
gradientLayer.colors = [topColor, bottomColor]
gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5)
gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5)
myButton.layer.insertSublayer(myButton, at: 0)

Answer 1

Создайте настраиваемый пользовательский класс, подобный этому

import Foundation
import  UIKit
@IBDesignable class CustomButton:UIButton {

    @IBInspectable var firstColor:UIColor = UIColor.clear {
        didSet {
            updateUI()
        }
    }
    @IBInspectable var secondColor:UIColor = UIColor.clear {
        didSet{
            updateUI()
        }
    }

    override class var layerClass: AnyClass {
        get {
            return CAGradientLayer.self
        }
    }
    func updateUI(){
        let gradient: CAGradientLayer = self.layer as! CAGradientLayer
        gradient.frame = self.bounds
        gradient.colors = [firstColor,secondColor].map { $0.cgColor }
        gradient.locations = [0.0,1.0]
        gradient.startPoint =  CGPoint(x: 0.0, y: 1.0)
        gradient.endPoint = CGPoint(x: 1.0, y: 1.0)

    }
}

, из своего инспектора удостоверений, установите для своего класса UIbutton значение CustomButtom, например,

из инспектора атрибутов.измените цвет градиента на тот, который вы хотите установить

и, наконец, ваша кнопка будет выглядеть следующим образом:

, если выхотите изменить начальную и конечную точки на эти цвета, просто поиграйте с этими двумя значениями

Gradient) * * тысяча двадцать-один

Answer 2

Вы должны обновить рамку градиента, когда выложен вид:

override func viewDidLayoutSubviews() {
    myButton.layer.sublayers?.first?.frame = myButton.bounds
}