UITableView showing only one cell

Question

I've a UITableView with multiple data cells but when is loadaded just one cell is showed. To test, I've added 4 strings in array.

class LoadingDataViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableViewDataLoading: UITableView!
    var dados = ["Vendas","Produtos","Pessoas","Animais"]
    
    override func viewDidLoad() {
        super.viewDidLoad()
        print("View did load")
        tableViewDataLoading.delegate = self
        tableViewDataLoading.dataSource = self
        tableViewDataLoading.layer.cornerRadius = 15.0
        tableViewDataLoading.layer.borderColor = UIColor.vorazColor.cgColor
        tableViewDataLoading.layer.borderWidth = 1.0
        tableViewDataLoading.clipsToBounds = true
    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return dados.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "CellLoadingData") as! CellDataLoading
        print("CELL: \(indexPath.row) - \(dados[indexPath.row])")
        cell.lblDado.text = dados[indexPath.row]
        cell.indicatorDado.startAnimating()
        return cell
    }
    
    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerView = UIView(frame: CGRect(x: 0, y: 0, width: tableView.frame.width, height: UITableViewAutomaticDimension))
        let label = UILabel(frame: headerView.frame)
        label.center = headerView.center
        headerView.backgroundColor = UIColor.vorazColor
        label.text = "Baixando dados..."
        label.textColor = UIColor.white
        headerView.addSubview(label)
        return headerView
    }
    
    func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
        let buttonCancel = UIButton(frame: CGRect(x: 0, y: 0, width: tableView.frame.width, height: UITableViewAutomaticDimension))
        buttonCancel.backgroundColor = UIColor.vorazColor
        buttonCancel.setTitle("Cancelar", for: .normal)
        buttonCancel.addTarget(self, action: #selector(cancelar), for: .touchUpInside)
        return buttonCancel
    }
    
    @objc func cancelar(_ sender : UIButton) {
        self.dismiss(animated: true, completion: {})
    }
    
}

class CellDataLoading : UITableViewCell {
    
    @IBOutlet weak var imgCheckDado: UIImageView!
    @IBOutlet weak var indicatorDado: UIActivityIndicatorView!
    @IBOutlet weak var lblDado: UILabel!
    
    override func awakeFromNib() {
        super.awakeFromNib()
    }
    
}

The result:

Storyboard:

Obs.: The label of header view is not showed and this ViewController is presented like popup.

I see the separator line near the bottom of that view. Is that something you can scroll down to view the other 3 cells? Maybe you need to make the height of your cell much more narrow? — Michael Dautermann, Sep 26 '18 at 15:09
I fixed height, but the Table use more space that need. https://imgur.com/a/nMzWNnd — Augusto, Sep 26 '18 at 15:12

score 1 · Answer 1 · answered Sep 26 '18 at 15:15

1

There's a couple numbers that matter here. Checkout a screenshot from my project:

I gave this table an explicit row height, and at the bottom, I gave the table a fixed height via AutoLayoutw.

These numbers are probably not right for your project, but if you adjust the height of your cells I think you'll see much better results.

answered Sep 26 '18 at 15:15

Michael Dautermann

88,797
17
166
215

I fixed the row height and works, but the height of `TableView` keeping more that needs. – Augusto Sep 26 '18 at 15:16
You can shrink your table view by clicking on the table view and then adding a height constraint. – Michael Dautermann Sep 26 '18 at 15:19
The height depends of quantity of itens – Augusto Sep 26 '18 at 15:20
Other people [have](https://stackoverflow.com/questions/31760815/set-tableview-height-by-the-number-or-rows) [solved](https://stackoverflow.com/questions/13001944/uitableview-height-based-on-number-of-cells/13001995) [this](https://stackoverflow.com/questions/41094672/increase-tableview-height-based-on-cells/41117658) [problem](https://blog.ijasoneverett.com/2014/02/resize-uitableview-height-with-auto-layout/) [before](https://stackoverflow.com/questions/23240761/adjust-uitableview-height-dynamically). – Michael Dautermann Sep 26 '18 at 15:26

Dhaval Dobariya · Answer 2 · 2018-09-26T15:45:40.850

0

Set height constraint to your UITableView and use it like below:

@IBOutlet weak var tableHeightConstraint: NSLayoutConstraint!
override func viewDidLoad() {
    super.viewDidLoad()

    tableViewDataLoading.delegate = self
    tableViewDataLoading.dataSource = self
    tableViewDataLoading.layer.cornerRadius = 15.0
    tableViewDataLoading.layer.borderColor = UIColor.vorazColor.cgColor
    tableViewDataLoading.layer.borderWidth = 1.0
    tableViewDataLoading.clipsToBounds = true

    // For dynamic height of cells if you need that otherwise only write `heightForRowAtIndexPath`
    tableViewDataLoading.estimatedRowHeight = 88.0
    tableViewDataLoading.rowHeight = UITableViewAutomaticDimension
    tableViewDataLoading.addObserver(self, forKeyPath: "contentSize", options: NSKeyValueObservingOptions.new, context: nil)

}

override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {

    tableHeightConstraint.constant = tableViewDataLoading.contentSize.height
    UIView.animate(withDuration: 0.5) {
        self.updateConstraints()
        self.layoutIfNeeded()
    }

}

func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    // For static height
    // return 40 // Here you can set your desired height 

    // For dynamic cell height 
    return UITableViewAutomaticDimension
}

edited Sep 26 '18 at 15:45

answered Sep 26 '18 at 15:28

Dhaval Dobariya

475
4
9

The height problem is about whole UITableView, not for each row. – Augusto Sep 26 '18 at 15:29
1

From your screen shot I can not tell constraints are proper or not, have you set height and width constraints or top, bottom, leading and trailing for your UITableView? – Dhaval Dobariya Sep 26 '18 at 15:33
I have update my answer to set dynamic height of UITableView based on its content. – Dhaval Dobariya Sep 26 '18 at 15:48
Change nothing. – Augusto Sep 26 '18 at 15:53
Have you set height, leading, trailing and centre vertically or top constraints as per your needs? – Dhaval Dobariya Sep 26 '18 at 15:59
Yes, but in other cases that I need this, the size is automatically changed. – Augusto Sep 26 '18 at 16:03
Then you have to try `active=true` or `active=false` for some constraint in particular cases when you don't need them. – Dhaval Dobariya Sep 26 '18 at 16:07

score 0 · Accepted Answer · answered Sep 26 '18 at 16:06

0

Although I like Dhaval D approach more than what I did in a recent project, mainly the observer on table content size, here is what I did under a time crunch.

Table view is in a container view. Container view has a height constraint on it. Table view is pinned on all sides to Container view. Anytime tableview data changes, I called

func updateTableSize() {

        self.tableView.layoutIfNeeded()
        var tableFrame = tableView.frame
        tableFrame.size.height = tableView.contentSize.height
        tableFrame.size.width = tableView.contentSize.width 
        tableView.frame = tableFrame
        heightConstraint.constant = tableFrame.size.height
    }

answered Sep 26 '18 at 16:06

Augie

1,341
1
11
18

This solves my problem, but the little white space appears between footer and border: https://imgur.com/a/clZOWrv – Augusto Sep 26 '18 at 16:17
@Augusto. Have you tried Debug View Hierarchy to see where that white space is coming from ? https://developer.apple.com/library/archive/documentation/DeveloperTools/Conceptual/debugging_with_xcode/chapters/special_debugging_workflows.html – Augie Sep 26 '18 at 16:22

UITableView showing only one cell

3 Answers3