How to expand a UITableView inside a StackView? - swift

Question

I have programatically created a Stackview along with a UITableView inside it.
func setupStack() {
view.addSubview(stackView)
stackView.axis = .vertical
stackView.distribution = .fillEqually
stackView.spacing = 8
}
func fillStackView() {
yearTable.isHidden = true
yearTable.layer.cornerRadius = 10
allViews.append(yearTable) // adding the view to an array of views
// other views also created and added to stack
}
My problem is that when I fade in the tableView, it takes up as much space as the other views in the table which all have a height of 40. The tableView has a height of 150 but it never expands to that height. How do I get it to expand?

Answer 1

UITableView does not have an intrinsic height/width so when placed in a UIStackView without any height/width information, it will be provided a default size. i.e. if your tallest view in the stack is 60 in height, then the tableView will also be 60.
You could alter this by giving yearTable a height constraint before adding it to the UIStackView, like so:
func fillStackView() {
//...
yearTable.translatesAutoresizingMaskIntoConstraints = false
yearTable.heightAnchor.constraint(equalToConstant: 150).isActive = true
allViews.append(yearTable)
//...
}
But do note that if you do this then because of stackView.distribution = .fillEqually, all your other views in the UIStackView will also become 150.
(EXTRA) Playground Example:
import UIKit
import PlaygroundSupport
class ViewController: UIViewController {
lazy var stackView: UIStackView = {
let stackView = UIStackView()
stackView.axis = .vertical
stackView.distribution = .fillEqually
stackView.spacing = 8
stackView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(stackView)
stackView.widthAnchor.constraint(equalToConstant: 200).isActive = true
return stackView
}()
let datasource = [1,2,3,4,5,6,7,8,9,10]
override func viewDidLoad() {
super.viewDidLoad()
appendLabel(text: "Hello, World!", color: .lightGray)
appendLabel(text: "Lorem\nipsum\ndolor\nsit", color: .gray)
appendTableView()
}
func appendLabel(text: String, color: UIColor) {
let label = UILabel()
label.backgroundColor = color
label.numberOfLines = 0
label.text = text
stackView.addArrangedSubview(label)
}
func appendTableView() {
let tableView = UITableView()
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "Cell")
tableView.dataSource = self
tableView.translatesAutoresizingMaskIntoConstraints = false
tableView.heightAnchor.constraint(equalToConstant: 150).isActive = true
stackView.addArrangedSubview(tableView)
}
}
extension ViewController: UITableViewDataSource {
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return datasource.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
let item = datasource[indexPath.row]
cell.textLabel?.text = String(item)
return cell
}
}
let vc = ViewController()
vc.view.frame = CGRect(x: 0, y: 0, width: 320, height: 480)
PlaygroundPage.current.setLiveView(vc.view)
Comment tableView.heightAnchor.constraint(equalToConstant: 150).isActive = true to see the difference