Button gradient not working when added to viewDidLayoutSubviews - ios

Question

I am adding a button gradient using the below code
extension UIView {
func applyGradient(colors: [UIColor]) {
self.applyGradient(colors: colors, locations: nil)
}
func applyGradient(colors: [UIColor], locations: [NSNumber]?) {
let gradient = CAGradientLayer()
gradient.frame = self.bounds
gradient.colors = colors.map { $0.cgColor }
gradient.locations = locations
gradient.startPoint = CGPoint(x: 0, y: 0)
gradient.endPoint = CGPoint(x: 1, y: 0)
self.layer.insertSublayer(gradient, at: 0)
}
}
Calling initStyle() in viewDidLayoutSubviews() is not working.
func initStyle() {
submitBtn.applyGradient(colors: [#colorLiteral(red: 0.1176470588, green: 0.3882352941, blue: 0.5254901961, alpha: 1), #colorLiteral(red: 0.2941176471, green: 0.9098039216, blue: 0.9529411765, alpha: 1)])
submitBtn.layer.cornerRadius = 15.0
submitBtn.layer.masksToBounds = true
}
I am creating all UI elements programatically. I had constraints setup properly and is working.
lazy var submitBtn: UIButton = {
let btn = UIButton(type: .system)
btn.translatesAutoresizingMaskIntoConstraints = false
btn.setTitle("SUBMIT", for: .normal)
return btn
}()
How to make this working?
The gradient display only if I place initStyle() in viewDidAppear() and not in viewDidLayoutSubviews(), which is creating a delay in displaying the button gradient. I want to avoid this delay. So I am adding it in viewDidLayoutSubviews, but then the gradient does not appear.

Answer 1

I think the problem here is that self.bounds is 0 at the point you are calling your gradient function. Try calling it at a later time, for example viewWillAppear or call view.layoutSubViews to trigger iewDidLayoutSubviews()

Answer 2

lazy var submitBtn: UIButton = {
let btn = UIButton(type: .custom) //Set custom instead of system
btn.translatesAutoresizingMaskIntoConstraints = false
btn.setTitle("SUBMIT", for: .normal)
return btn
}()

Answer 3

try using the function inside
viewWillAppeare()
Also why not apply the gradient into the button from the start without a separated function? that will make the button appears w\ the gradient already builtin.
if you want to set the gradient w\ a condition you could use the following
func displayButton(condition: Bool){
lazy var submitBtn: UIButton = {
let btn = UIButton(type: .system)
btn.translatesAutoresizingMaskIntoConstraints = false
btn.setTitle("SUBMIT", for: .normal)
if condition == true {
//set the gradient here
return btn
} else if condition == false
return btn
}
}()
override func viewDidLoad(){
super.viewDidLoad()
//here you can set the condition to show the gradient or not depending on what you want
displayButton(true) //will show the gradient
displayButton(false) // will show without gradient
}
I can't test this code at the moment so i'm not sure about it, give it a try.