noblerare
noblerare

Reputation: 11853

Swift 3 - Expandable table view cells without closing other ones

I am using Swift 3.

I've been following this tutorial: https://www.youtube.com/watch?v=VWgr_wNtGPM , supplemented by this answer on StackOverflow.

However, the way that this works is that if I click on a cell, it expands while hiding other cells. How do I make it such that when I expand it, the other already-expanded cells stay expanded?

Upvotes: 1

Views: 3712

Answers (3)

Okhan Okbay
Okhan Okbay

Reputation: 1394

You can use ExpyTableView, which makes an expandable section from your given header cell. Compatible down to iOS 8.0.

All you have to do is to import ExpyTableView and then:

class ViewController: ExpyTableViewDataSource, ExpyTableViewDelegate {

  @IBOutlet weak var expandableTableView: ExpyTableView!

  // First, set data source and delegate for your table view.
  override func viewDidLoad() {
    super.viewDidLoad() 
    expandableTableView.dataSource = self
    expandableTableView.delegate = self
  }

  // Then return your expandable cell instance from expandingCell data source method.
  func expandableCell(forSection section: Int, inTableView tableView: ExpyTableView) -> UITableViewCell {
    // this cell will be displayed at IndexPath with section: section and row 0
  }
} 

You can see your former table view section is now an expandable table view section. You can also download the example project and see more detailed examples.

Upvotes: 0

Abel Lee
Abel Lee

Reputation: 55

if you wanna do this yourself, you could try this way.

first step is you should create a model list just like:

var cellsData: [CustomData] = [];

the CustomData seem like:

class CustomData {
     var isExpanded: Bool = false;
     // whatever other variables
}

then your custom cell should whatever look like but you must do something in the tableView:didSelectItemAt like:

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
   let row = indexPath.row;
   self.cellsData[row].isExpanded = !self.cellsData[row].isExpanded;
   self.tableView.reloadRows(at: [indexPath], with: .none); // or the other animations
}

then in the "tableView:cellForRowAt" seems like:

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CustomCell", for: indexPath) as! CustomCell;
    if(cell.isExpanded){
        // do something when the cell is expanded
    }else{
        // do something when the cell is not expanded
    }
}

remember, the cell is reusable, means if you have used the cell more than one time, then the cell will keep the state when it was used the last time.

Upvotes: 0

Ricowere
Ricowere

Reputation: 707

The best approach I suggest you for achieving this in an elegant way is implementing it through UIStackView elements.

Take a look this post http://www.atomicbird.com/blog/uistackview-table-cells

Upvotes: 2

Related Questions