Search code examples
iosswiftconstraintssubviewaddsubview

Referencing superview inside of view code class file


I'm currently trying to learn constraints and styling programmatically in Swift. I'm also trying to maintain clean and modularized code by splitting up code that relates to "styling".

I simply have my LoginViewController:

import UIKit

class LoginViewController: UIViewController {

    var loginView: LoginView!

    override func viewDidLoad() {
        super.viewDidLoad()

        loginView = LoginView(frame: CGRect.zero)
        self.view.addSubview(loginView)

        // AutoLayout
        loginView.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets.zero, excludingEdge: .bottom)
    }

    override var preferredStatusBarStyle: UIStatusBarStyle {
        return .lightContent
    }

}

Then my LoginView:

import UIKit

class LoginView: UIView {
    var shouldSetupConstraints = true

    var headerContainerView: UIView!

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

        // Header Container View
        headerContainerView = UIView(frame: CGRect.zero)
        headerContainerView.backgroundColor = UIColor(red:0.42, green:0.56, blue:0.14, alpha:1.0) // #6B8E23
        headerContainerView.translatesAutoresizingMaskIntoConstraints = false

        self.addSubview(headerContainerView)

        headerContainerView.topAnchor.constraint(equalTo: self.superview!.topAnchor)

    }

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

    override func updateConstraints() {
        if(shouldSetupConstraints) {
            // AutoLayout constraints
            shouldSetupConstraints = false
        }
        super.updateConstraints()
    }
}

Where I am getting stuck is with just simply trying to add this headerContainerView to the top of my superview. I want to be able to add it so it pins itself to the top, left and right of the superview and only 1/3 of the superview's height. I continue to try and reference the superview with no success and I cannot find a solution that helps me understand on the internet. Any suggestions on how I can complete this?

Thank you for taking the time for those that respond.

NOTE: I did start out using PureLayout which is really nice. However, I am an individual that likes to understand what is going on behind the scenes or at least how to write the code at its base level. You can see that I am using a PureLayout function in my LoginViewController, but I am looking to change that. I would prefer a solution that doesn't add a third party library.


Solution

  • Here self in the custom UIView class is the parent view of headerContainerView so , You can add this , Also I recommend to learn constraints first without 3rd party libraries to fully understand the concept as you will learn a lot from seeing conflicts and other things , once done , shift to libraries

    override init(frame: CGRect) {
        super.init(frame: frame)
    
        // Header Container View
        headerContainerView = UIView(frame: CGRect.zero)
        headerContainerView.backgroundColor = UIColor(red:0.42, green:0.56, blue:0.14, alpha:1.0) // #6B8E23
        headerContainerView.translatesAutoresizingMaskIntoConstraints = false
    
        self.addSubview(headerContainerView)
        headerContainerView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
        headerContainerView.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
        headerContainerView.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true
        headerContainerView.heightAnchor.constraintEqualToAnchor(self.heightAnchor, multiplier:1.0/3.0, constant: 0.0).active = true
    
    }
    

    // loginView layout

    override func viewDidLoad() {
        super.viewDidLoad()
    
        loginView = LoginView(frame: CGRect.zero)
        self.view.addSubview(loginView)
        loginView.translatesAutoresizingMaskIntoConstraints = false
        loginView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
        loginView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
        loginView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
        loginView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true