Why does the UITableView goes below the TabBar? - ios

Question

This is how it currently looks:
Image here
This is my current code:
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor(red: 4/255, green: 4/255, blue: 4/255, alpha: 1.0)
self.navigationController?.navigationBar.barStyle = .black
self.navigationController?.navigationBar.tintColor = UIColor.white
self.navigationItem.title = "Test"
self.navigationController?.navigationBar.prefersLargeTitles = true
// Get main screen bounds
let screenSize: CGRect = UIScreen.main.bounds
let screenWidth = screenSize.width
let screenHeight = screenSize.height
myView.frame = CGRect(x: 0, y: 0, width: screenWidth, height: 150)
myView.backgroundColor = .red
self.view.addSubview(myView)
myTableView.frame = CGRect(x: 0, y: myView.frame.size.height, width: screenWidth, height: screenHeight-myView.frame.size.height-(navigationController?.navigationBar.frame.size.height)!-(tabBarController?.tabBar.frame.size.height)!)
print("SCREEN: \(screenHeight)")
print("TABLEVIEW: \(myTableView.frame.size.height)")
myTableView.dataSource = self
myTableView.delegate = self
myTableView.backgroundColor = .blue
myTableView.layer.borderWidth = 3
myTableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
self.view.addSubview(myTableView)
}
It looks liked I have coded it correctly. Also in the Storyboard's Attribute Inspector, I have unchecked the Extend Edges: Under Bottom Bar. Any ideas?

Answer 1

Guessing here, but you're probably having an autoresizing mask translated to a constraint. Breaking your layout as a result. Try:
myView.autoresizingMask = []
myTableView.autoresizingMask = []
// or alternatively
myView.translatesAutoresizingMaskIntoConstraints = false
myTableView.translatesAutoresizingMaskIntoConstraints = false
But it does not matter whether things are set up correctly or not because you are calculating the actual layout by hand. Try to utilize Auto Layout instead:
myView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(myView)
myView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
myView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
myView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
myView.heightAnchor.constraint(equalToConstant: 150).isActive = true
myTableView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(myTableView)
myTableView.topAnchor.constraint(equalTo: myView.bottomAnchor).isActive = true // making myTableView to lie just below myView
myTableView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
myTableView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
myTableView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true