change the y value on a cgrect frame to 80 below the top of the screen

Question

I want my swift code to place 2 image views on the screen. The image views are being placed via cgrect frame. What i want is box1 to cover from the top of the screen to 80 percent of the height of the screen. The bottom 20 percent of the height should be covered by box2. Somehow on the y value i need box2 to start at 80 below the top of the screen.

import UIKit

class ViewController: UIViewController {
    
    
    
    var box1 = UIImageView()
    var box2 = UIImageView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        let VCframe = self.view.frame
        let height = VCframe.height * 0.8
        
        let height2 = VCframe.height * 0.2
        let widthx = VCframe.width
        view.addSubview(box1)
        view.addSubview(box2)
        box1.backgroundColor = .red
        box2.backgroundColor = .blue
        
        
        box1.frame = CGRect(x: 0, y: 0, width: widthx, height: height)
        box2.frame = CGRect(x: 0, y: 0, width: widthx, height: height2)
        
    }
    
    
    
    
}

Answer 1

So i think this is the solution you are looking for:

    class ViewController: UIViewController {

    var box1 = UIImageView()
    var box2 = UIImageView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        let VCframe = self.view.frame
        let height = VCframe.height * 0.8
        
        let height2 = VCframe.height * 0.2
        let widthx = VCframe.width
        view.addSubview(box1)
        view.addSubview(box2)
        box1.backgroundColor = .red
        box2.backgroundColor = .blue
        box1.translatesAutoresizingMaskIntoConstraints = false
        box2.translatesAutoresizingMaskIntoConstraints = false
        
        
        box1.frame = CGRect(x: 0, y: 0, width: widthx, height: height)
        box2.frame = CGRect(x: 0, y: height, width: widthx, height: height2)
        
    }
}

However, it's not really a good idea to use frames as a layout pattern.

This is probably what you want to do:

    class ViewController: UIViewController {

    var box1 = UIImageView()
    var box2 = UIImageView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        loadViews()
    }
    
    private func loadViews() {
        view.addSubview(box1)
        view.addSubview(box2)
        box1.backgroundColor = .red
        box2.backgroundColor = .blue
        box1.translatesAutoresizingMaskIntoConstraints = false
        box2.translatesAutoresizingMaskIntoConstraints = false
        
        NSLayoutConstraint.activate([
            box1.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            box1.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            box1.heightAnchor.constraint(equalToConstant: UIScreen.main.bounds.height*0.8),
            box1.topAnchor.constraint(equalTo: view.topAnchor),
            
            box2.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            box2.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            box2.topAnchor.constraint(equalTo: box1.bottomAnchor),
            box2.bottomAnchor.constraint(equalTo: view.bottomAnchor)
        ])
    }
}