Nested Comments UI - UITableView

I am working on news reading app - and I am having trouble with the comments UI. What is the proper way to nest comments - eg: Apollo, Narwhal etc. Do they just indent the content in the cell based on the ‘depth’ of the comment? Or is there another way to achieve this?

Thanks in advance!

I’ve tried using the cell.indentationLevel UITableViewCell property. However I can’t see any effect on the UI with the modification made.

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: CommentCell.reuseIdentifier, for: indexPath) as! CommentCell
    let item = self.commentsArray[indexPath.row].0
    let depth = self.commentsArray[indexPath.row].1
    // Indent Cell based on the depth of the comment
    // cell.indentationWidth = 10 // this is the default value anyway
    cell.indentationLevel = Int(depth)

I’ve also tried playing around with cell.separatorInset = UIEdgeInsetsMake(0, 10, 0, 0), without success.

I don’t understand why I don’t see any effect when I modify the indentationLevel. Can someone point me towards a tutorial/screencast to understand these Cell properties better? I’ve searched around RayW videos, but I couldn’t find anything more advanced on this topic.

Thanks again!

I’ve found a solution.

To indent a cell’s content use indentationLevel property. However custom cells don’t apply indentationLevel automatically. We need to update layoutMargins manually. Also make sure that the cell’s element are using the superview’s layoutMarginGuide as a constraint for the left side!

class CommentCell: UITableViewCell {
static let reuseIdentifier = "CommentCell"

@IBOutlet weak var commentLabel: UILabel!
@IBOutlet weak var elapsedTimeLabel: UILabel!
@IBOutlet weak var byUserLabel: UILabel!
@IBOutlet weak var depthLabel: UILabel!

override func layoutSubviews() {
    // Custom layout cells don't apply indentationLevel automatically. We need to update layoutMargins manually
    contentView.layoutMargins.left = layoutMargins.left + CGFloat(indentationLevel) * indentationWidth


@el_cid Thank you for sharing the solution - much appreciated! :]

1 Like

Np, I love this site! :blush:

This topic was automatically closed after 166 days. New replies are no longer allowed.