iOS8: Auto-layout and Gradient

Setup:

I have a View Controller that consists of a View and a Container View.

The View (Orange) is pinned to top 0, left 0, and right 0.

The Container View (Gray) is pinned to bottom 0, left 0, and right 0.

The View's Bottom Space to: Container View = 0

The View's Proportional Height to Container View = 1

Desired Results: I would like to add gradient to the background of the View (Orange)

Tried:

I'm using Auto-layout with class sizes to get different behavior on different screen.

Code:

class ViewController: UIViewController {

    @IBOutlet weak var graphView: UIView!
    @IBOutlet weak var containerView: UIView!
    override func viewDidLoad() {
        super.viewDidLoad()

        let backgroundColor = CAGradientLayer().graphViewBackgroundColor()
        backgroundColor.frame = self.graphView.frame

        self.graphView.layer.addSublayer(backgroundColor)
}

I have a category:

extension CAGradientLayer {

    func graphViewBackgroundColor() -> CAGradientLayer {

        let topColor = UIColor(red: (160/255.0), green: (160/255.0), blue: (160/255.0), alpha: 1)
        let bottomColor = UIColor(red: (52/255.0), green: (53/255.0), blue: (52/255.0), alpha: 1)

        let gradientColors: [CGColor] = [topColor.CGColor, bottomColor.CGColor]
        let gradientLocations: [Float] = [0.0, 1.0]

        let gradientLayer: CAGradientLayer = CAGradientLayer()
        gradientLayer.colors = gradientColors
        gradientLayer.locations = gradientLocations

        return gradientLayer
    }
}

Result:

As you can see gradient did not cover the entire View.

Question: How can I get the gradient to cover the entire View

Update:

When I place the code in viewDidLayoutSubviews() It looks weird when I rotate:

回答1:

Simply do it this inside viewDidLayoutSubviews:

override func viewDidLayoutSubview() {
  super.viewDidLayoutSubviews
  backgroundColor.frame = self.graphView.bounds
}

viewDidLayoutSubviews should be called when you rotate the device.

If it is not called, override this method and do it as,

override func viewWillTransitionToSize(size: CGSize, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) {
  super.viewWillTransitionToSize(size, withTransitionCoordinator: coordinator)

  backgroundColor.frame = self.graphView.bounds
}

回答2:

Try putting your gradient code into viewDidLayoutSubviews instead of viewDidLoad

When viewDidLoad is called the views are not laid out (ie do not have their final frames set yet), so this is why you are only seeing a partial coverage of the gradient