How to create multiple UITableViews programmatically using Swift?

Question

Hi I'm trying to build an app with one page of two tableViews. I tried to distinguish them by tag, but they don't work well together, so I wanna get some help. I did this all programmatically so there's no IBOutlet. below is the code modified for easy read. Thanks.

class test: UIViewController,UITableViewDataSource, UITableViewDelegate {

var ingredientItems = 3
var stepItems = 3

let ingredientsTableView: UITableView = {
    let tv = UITableView()
    tv.tag = 101
    tv.translatesAutoresizingMaskIntoConstraints = false
    return tv
}()

let stepsTableView: UITableView = {
    let tv = UITableView()
    tv.tag = 102
    tv.translatesAutoresizingMaskIntoConstraints = false
    return tv
}()

override func viewDidLoad() {

    super.viewDidLoad()

    ingredientsTableView.delegate = self
    ingredientsTableView.dataSource = self
    ingredientsTableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")

    stepsTableView.delegate = self
    stepsTableView.dataSource = self
    stepsTableView.register(UITableViewCell.self, forCellReuseIdentifier: "stepscell")

    view.addSubview(ingredientsTableView)
    view.addSubview(stepsTableView)

    setupIngredientsTableView()//just setting up anchors
    setupStepsTableView()//just setting up anchors

}
    func setupIngredientsTableView() {
    //Constraints :  need x,y, width and height
    ingredientsTableView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
    ingredientsTableView.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true
    ingredientsTableView.widthAnchor.constraint(equalTo: view.widthAnchor, constant: -24).isActive = true
    ingredientsTableView.heightAnchor.constraint(equalToConstant: 200).isActive = true
}

func setupStepsTableView() {
    //Constraints :  need x,y, width and height
    stepsTableView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
    stepsTableView.topAnchor.constraint(equalTo: view.topAnchor, constant: 350).isActive = true
    stepsTableView.widthAnchor.constraint(equalTo: view.widthAnchor, constant: -24).isActive = true
    ingredientsTableView.heightAnchor.constraint(equalToConstant: 200).isActive = true
}
//
// table view
//
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    if tableView.tag == 101{
        return self.ingredientItems
    }else{
        return self.stepItems
    }
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    if tableView.tag == 101{

        tableView.rowHeight = 30.0
        let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "cell")! as UITableViewCell
        cell.textLabel?.text = String(describing: indexPath)

        return cell

    }else{

        tableView.rowHeight = 30.0
        let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "stepscell")! as UITableViewCell
        cell.textLabel?.text = "test"
        return cell
    }
}    

}

Answer 1

You just have a typo in setupStepsTableView function, you set the height anchor of the ingredientsTableView instead of stepsTableView ( I put ** ** )

func setupStepsTableView() {
//Constraints :  need x,y, width and height
stepsTableView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
stepsTableView.topAnchor.constraint(equalTo: view.topAnchor, constant: 350).isActive = true
stepsTableView.widthAnchor.constraint(equalTo: view.widthAnchor, constant: -24).isActive = true
**ingredientsTableView.heightAnchor.constraint(equalToConstant: 200).isActive = true**

}

instead you should have it

stepsTableView.heightAnchor.constraint(equalToConstant: 200).isActive = true

There is no problem having two table views in one UIViewController class as long as you set both tableViews ' delegate and datasourse correctly. I also see that you tags work properly. Your code works fine see the result.