CODEWITHSUNDEEP
iosswiftuitableview
sarawanak
sarawanak

Reputation: 439

self sizing UITableViewCell goes small

I'm trying to create a table view cell prototype (similar to one below) programmatically.

enter image description here

The designed the cell with two stack views,
a) a vertical stack view to contain the text labels and,
b) a horizontal stack view to contain the image view & vertical stack view

I create the required views, stuff it in stack view, and pin stack view to table cell's contentView in the init() of tableviewcell.

And from cellForItemAtIndexPath I call configureCell() to populate data of the cell.

My init() looks like this

override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
    super.init(style: style, reuseIdentifier: reuseIdentifier)

    textStackView = UIStackView(arrangedSubviews: [priorityNameLabel, descriptionLabel])
    textStackView.axis = .vertical
    textStackView.alignment = .leading
    textStackView.distribution = .fill
    textStackView.spacing = 5

    containerStackView = UIStackView(arrangedSubviews: [priorityImageView, textStackView])
    containerStackView.axis = .horizontal
    containerStackView.alignment = .center
    containerStackView.spacing = 5
    containerStackView.distribution = .fill

    contentView.addSubview(containerStackView)
    containerStackView.translatesAutoresizingMaskIntoConstraints = false
    pinContainerToSuperview()
}

func pinContainerToSuperview() {
    containerStackView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).activate()
    containerStackView.topAnchor.constraint(equalTo: contentView.topAnchor).activate()
    containerStackView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).activate()
    containerStackView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).activate()
}

In my view controller, I set tableView rowHeight to automaticDimension and estimated height to some approx. value. When I run the code, all I'm getting is,

enter image description here

The narrow horizontal lines on the top of the image are my tableview cells (My data count is 3 in this case). I couldn't figure out the problem. Can someone point out what's going wrong here?

EDIT 1:

These are the instance members of my TableViewCell class

var containerStackView: UIStackView!
var textStackView: UIStackView!

var priorityImageView: UIImageView! {
    let imageView = UIImageView()
    imageView.contentMode = .scaleAspectFit
    return imageView
}

var priorityNameLabel: UILabel! {
    let label = UILabel()
    return label
}

var descriptionLabel: UILabel! {
    let label = UILabel()
    return label
}

Upvotes: 0

Views: 59

Answers (1)

Losiowaty
Losiowaty

Reputation: 8006

You have your labels and image view as computed properties - this means that every time you access them a new instance is created. This is bad. This basically means that when you set them as arranged subvies of your stack views and then try to configure them later, you work on different objects.

Simplest solution would be to create your labels and image view the way you create your stack views in init.

Upvotes: 1

Related Questions