UITableViewCell with undetermined number of items

Question

I need to make a cell with some buttons. This buttons are answers options to a question. But the question and the number of buttons (answers) are not determined because I get these data from Alamofire. So there may be 2, 3, 6, or any number of buttons. Is there a way to add these buttons programmatically depending on (for example) the number of items in an array, in a way that they look well constrained? Like a stack view?

Thanks in advance

Answer 1

A stack view is certainly a way of constraining any number of views into a column (or row). So that sounds like the best way to go.

Answer 2

This is a sneaky way to do it, but if you know the maximum number of buttons you're going to have, you can add it directly to your custom prototype cell on your storyboard without adding buttons programatically.

Solution (Written in Swift 4, but a general answer)

1. Assuming there is a maximum of 8 answers in any question, create 8 buttons in your custom prototype cell. Add constraints as you like to make them look pretty!
2. Remember to give your cell a unique identifier ("CustomCell" in my case).
3. Go to File > New File > Cocoa Touch Class > Select "TableViewCell" Subclass & give it an appropriate name (in my case CustomCellTableViewCell.swift). This will contain all your UI components outlets.
4. Select the prototype cell in your storyboard. Navigate to the third icon from the left and select "CustomCellTableViewCell" as your class.
5. Control+Drag outlets of your buttons and fields that you're going to be working with from the storyboard to your newly created CustomCellTableViewCell.swift. The file should now look something like this:

class CustomCellTableViewCell: UITableViewCell {
    @IBOutlet weak var question: UILabel!
    @IBOutlet weak var answerOne: UIButton!
    @IBOutlet weak var answerTwo: UIButton!
    ...
    ...
    @IBOutlet weak var answerEight: UIButton!

}

6. The next few steps will be in the TableviewDataSource function func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell. Remember to cast the TableviewCell as a CustomCell:

let cell = tableView.dequeueReusableCell(withIdentifier: "CustomCell") as! CustomCellTableViewCell

7. Put all the answer buttons in an array

var answerButtons = [cell.answerButtonOne, cell.answerButtonTwo..., cell.answerButtonEight]

8. Now you can set the answer button text in a loop as follows:

for i in 0..<answerButtons.count {
  if i < data[indexPath.row].answers.count { // if the answer exists, add it to the button
    cell.answerButton[i].isHidden = false // show button if answer exists 
    cell.answerButton[i].setTitle(data[indexPath.row], for: .normal)
  } else {
    cell.answerButton[i].isHidden = true // hide that button
  }
}