UITableView: How to change cell height dynamically when a button is clicked in it? Swift

Question

I can tell how to do this in objective-c from here, but how can I convert that to swift?

I have a UITableView with custom TableViewCells that has a UIButton called "expandButton". I am trying to figure out how to change the height of that particular cell when the expandButton for that cell is clicked.

Also, when it is clicked again, it should change back to original size. I am not familiar with ObjectiveC so please help me with this in Swift. Thanks a bunch in advance!

Here is what I have so far:

    //Declaration of variables as suggested
        var shouldCellBeExpanded:Bool = false
        var indexOfExpendedCell:NSInteger = -1

Now inside the ViewController. Note: TableViewCell is the name of my custom cell.

    //Inside the ViewController
        func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    if let cell:TableViewCell = TableViewCell() {

        cell.stopWatch = stopWatchBlocks[indexPath.row]

        cell.expandButton.tag = indexPath.row

        //Adding action to the expand button
        cell.expandButton.addTarget(self, action: "expandButtonAction1:", forControlEvents: UIControlEvents.TouchUpInside)

        return cell

    }

}

Now, the button action method:

    func expandButtonAction1(button:UIButton) {

    button.selected = !button.selected

    if button.selected {

        indexOfExpendedCell = button.tag
        shouldCellBeExpanded = true

        self.TableView.beginUpdates()
        self.TableView.reloadRowsAtIndexPaths([NSIndexPath(forItem: indexOfExpendedCell, inSection: 0)], withRowAnimation: .Automatic)
        self.TableView.endUpdates()

        button.setTitle("x", forState: UIControlState.Selected)
    }

    else if !button.selected {

        indexOfExpendedCell = button.tag
        shouldCellBeExpanded = false

        self.TableView.beginUpdates()
        self.TableView.reloadRowsAtIndexPaths([NSIndexPath(forItem: indexOfExpendedCell, inSection: 0)], withRowAnimation: .Automatic)
        self.TableView.endUpdates()

        button.setTitle("+", forState: UIControlState.Normal)
    }
}

And Finally the HeightForRowAtIndexPath

    func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {

    if shouldCellBeExpanded && indexPath.row == indexOfExpendedCell {
        return 166.0
    }
    else { return 91.0 }
}

I think I am missing something because the cell does expand when clicked once, but it does not 'shrink' back to 91 ever!

What am I doing wrong here?

score 13 · Accepted Answer · answered Feb 19 '16 at 22:28

Try not to use the selected tag as a toggle for a cell state such as this. Once a cell is selected, tapping it again will not deselect. Instead, you can just use the shouldCellBeExpanded flag:

func expandButtonAction1(button:UIButton) {

    shouldCellBeExpanded = !shouldCellBeExpanded
    indexOfExpendedCell = button.tag

    if shouldCellBeExpanded {
        self.TableView.beginUpdates()
        self.TableView.endUpdates()

        button.setTitle("x", forState: UIControlState.Normal)
    }

    else {
        self.TableView.beginUpdates()
        self.TableView.endUpdates()

        button.setTitle("+", forState: UIControlState.Normal)
    }
}

Also, from my experience the reloadRowsAtIndexPath method is unnecessary. Using the beginUpdates() and endUpdates() alone should do the trick unless you need custom animation.

Awesome! Thanks for the tip and the answer. That works great! — Vishrut Patel, Feb 22 '16 at 17:35
Anyone viewing this now just know your IBOutlet 'expandButton' is in your tableview cell class while your action button 'expandButtonAction1' is in the view controller class with your tableview class. And you can add @objc to your action button function with #selector(expandButtonAction1) inside the 'addTarget' call. Also '.Normal' is '.normal' — Douglas Banks, Apr 29 '20 at 10:35

score 0 · Answer 2 · answered Jun 07 '21 at 07:23

Swift 5.2

@objc func btn_hideunhidedes(sender:UIButton){ let index = sender.tag let cell : TVC_JoiningDetails = self.tv_JoiningDetails.cellForRow(at: IndexPath(row: index, section: 0)) as! TVC_JoiningDetails

    shouldCellBeExpanded = !shouldCellBeExpanded
    indexOfExpendedCell = index
    
    if shouldCellBeExpanded {
        self.tv_JoiningDetails.beginUpdates()
        self.tv_JoiningDetails.endUpdates()
        cell.btn_View.setTitle("X", for: .normal)
    }
    else {
        self.tv_JoiningDetails.beginUpdates()
        self.tv_JoiningDetails.endUpdates()
        cell.btn_View.setTitle("+", for: .normal)
    }
}

extension VC_JoiningProgram : UITableViewDelegate,UITableViewDataSource{ func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 2 }

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "TVC_JoiningDetails") as! TVC_JoiningDetails
    cell.btn_View.tag = indexPath.row
    cell.btn_View.addTarget(self, action: #selector(btn_hideunhidedes), for: .touchUpInside)
    return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    if shouldCellBeExpanded && indexPath.row == indexOfExpendedCell {
        return 324
    }
    else {
        return 264
    }
}

}

While this may solve the problem, it would be more helpful to the OP to provide some explanation directly answering their question "What am I doing wrong here?" — rakitin, Jun 07 '21 at 14:40

UITableView: How to change cell height dynamically when a button is clicked in it? Swift

2 Answers2

Linked