Right way to make a list with images inside a tableview cell SWIFT

Question

I currently have a UITableView in which each cell contains a list of users. I currently have it setup using a UITextView and line break after each name. I then set the cell height accordingly to how many people are in the group.This is working great but now I want to add profile pictures by each use. Here are two possible solutions I have come up with.

A tableview inside each table view cell
Using a method like this in order to add the image in as text and keep the current textview. I believe this would be the better/ more efficient option.

Which method of these two or other option would be the right way/ or most efficient way of going about doing this.

UPDATE : I am trying to implement a solution from below here is what I have tried but I am seeing nothing when running

ADDING STACK VIEW IN STORYBOARD

CREATING USER VIEW CLASS

import UIKit

@available(iOS 9.0, *)
class UserView: UIStackView {
    var name: String?
    var image: UIImage? // OR var imageName: String?

    override init(frame: CGRect) {
        super.init(frame: frame)
        setup()
    }

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        setup()
    }

    private func setup() {
        axis = .vertical

        let imageView = UIImageView(image: image)
        let nameLabel = UILabel()
        nameLabel.text = name

        addArrangedSubview(imageView)
        addArrangedSubview(nameLabel)
    }
}

CODE IN CELL FOR ROW AT INDEX PATH

        cell.mainStackView.frame = CGRect(x: 0, y: 0, width: cell.cellColor.frame.width, height: cell.cellColor.frame.height)

        for i in 0..<joinedArray.count {
            let user = UserView()
            user.name = joinedArray[i]
            cell.mainStackView.addArrangedSubview(user)
        }

What is the largest user count you want to support in your list? — digitalHound, Aug 13 '18 at 21:44

score 3 · Accepted Answer · answered Aug 14 '18 at 08:16

3

I would prefer UIStackView inside a UITableViewCell and UIStackView as a subview for each user entry

Something like below mentioned

class UserView: UIStackView {
    var name: String?
    var image: UIImage? // OR var imageName: String?

    override init(frame: CGRect) {
        super.init(frame: frame)
        setup()
    }

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        setup()
    }

    private func setup() {
        axis = .vertical

        let imageView = UIImageView(image: image)
        let nameLabel = UILabel()
        nameLabel.text = name

        addArrangedSubview(imageView)
        addArrangedSubview(nameLabel)
    }
}

answered Aug 14 '18 at 08:16

Satish

2,015
1
14
22

Can you explain a little more how I would implement this into my project, I don't really understand how to use it. Thank you, I appreciate the response. – user6520705 Aug 15 '18 at 22:09
@user6520705 Add UIStackView (ie, mainStackView) in your TableViewCell. Now add UserView UIStackView into mainStackView programmatically for each user – Satish Aug 17 '18 at 10:27
In storyboard i added a stack view to my cell. Then I created a class UserView. In my cellforrowatindexpath I loop through my array of users and for each one create a new UserView and do mainstackview.append the new UserView but when I build and run I do not see anything – user6520705 Aug 17 '18 at 14:59
@user6520705 If it is still not resolved, here is the complete solution https://gist.github.com/Satish/f973732730a24e08a4dd274d86c9e2d2 – Satish Aug 21 '18 at 07:57

score 0 · Answer 2 · answered Aug 13 '18 at 21:08

Instead of putting a UITableView inside a UITableViewCell, you could try to put a UICollectionView in a UITableViewCell. Technically it's the same but with the collection view you get more versatility in the way you can have your images displayed in different layouts (assuming that each UICollectionViewCell takes a UIImageView for each respective image). Ash Furrow has a really nice blog post on this as well as the respective GitHub rep.

Right way to make a list with images inside a tableview cell SWIFT

2 Answers2