自定义元素的子层未在模拟器中呈现，在界面生成器中呈现

Question

I am trying to make a custom gradient layer that I can reuse in the Interface Builder for my different views. I created the following class:

import UIKit

@IBDesignable
class MyGradientLayer: UIView {

    let gradient = CAGradientLayer()

    public override init(frame: CGRect) {
        super.init(frame: frame)

        gradient.colors = [startColor.cgColor, endColor.cgColor]
        gradient.frame = self.bounds
        gradient.locations = [0, 1]
        self.layer.insertSublayer(gradient, at: 0)
    }

    public required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    @IBInspectable
    public var startColor: UIColor = UIColor.init(red: 1, green: 0.364, blue: 0.22352, alpha: 1.0) {
        didSet {
            gradient.colors = [startColor.cgColor, endColor.cgColor]
        }
    }

    @IBInspectable
    public var endColor: UIColor = UIColor.init(red: 1, green: 0.1607, blue: 0.40392, alpha: 1.0) {
        didSet {
            gradient.colors = [startColor.cgColor, endColor.cgColor]
        }
    }

    override func layoutSubviews() {
        gradient.frame = self.bounds
        gradient.locations = [0, 1]
        super.layoutSubviews()
    }

}

I then added a UIView to my ViewController and set the class to MyGradientLayer in the Identity inspector. My nice little gradient view then renders just fine in the Interface Builder. I go ahead and set the constraints to take up the whole screen (I tried manual and auto constraints). All is well, right?

Nope, it does not render the gradient layer in the simulator. However, I know that the view is there and is being put onto the screen, because I can set the background color of the UIView in IB, and it shows on the whole screen.

Any thoughts as to why the gradient layer inside my custom UIView is not rendering in the Simulator?

Thanks!

Answer 1

See what happens if you change the "init" as follows:

public override init(frame: CGRect) {
    super.init(frame: frame)
    self.commonInit()
}

public required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    self.commonInit()
}

func commonInit() {

    gradient.colors = [startColor.cgColor, endColor.cgColor]
    gradient.frame = self.bounds
    gradient.locations = [0, 1]
    self.layer.insertSublayer(gradient, at: 0)

}

Depending on how it's used, you may need to set a flag to prevent commonInit from being called more than once. Give it a try and see.