Swift3: UITableViewCell and UIButton - Show and hide UITableViewCell by clicking the UIButton - ios

Question

I'm pretty new to Swift 3.0 and am currently working on a school project on IOS app.
I'm having difficulties with the linkage of the UITableViewCell and UIButton.
This is how my app looks like
Basically, what I'm trying to do is that when I click the UIButton, it will decrease the height of cells (Diary and Trend) to 0 (to hide the cells)
and
increase the height of cells (Share and How to use the BP Monitor)(to show the cells) - assuming that the cells (Share and How to use the BP Monitor) are 'hidden' now.
Appreciate if there's an example to follow.
Thank you very much :)
*After trying the example given by #Sandeep Bhandari
This is the code in my ViewController:
class TableViewController: UITableViewController {
var expandedCellIndex : IndexPath? = nil
override func numberOfSections(in tableView: UITableView) -> Int { return 1 }
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 5
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
var cell : UITableViewCell! = nil
if indexPath == expandedCellIndex {
cell = tableView.dequeueReusableCell(withIdentifier: "expandedCell") as! ExpandedTableViewCell
(cell as! ExpandedTableViewCell).label1.text = "shown"
(cell as! ExpandedTableViewCell).label2.text = "Efgh"
(cell as! ExpandedTableViewCell).label3.text = "xyz"
}
else {
cell = tableView.dequeueReusableCell(withIdentifier: "simpleCell") as! SimpleTableViewCell
(cell as! SimpleTableViewCell).label.text = "abcd"
}
return cell
}
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
if self.expandedCellIndex == indexPath {
self.expandedCellIndex = nil
}
else {
self.expandedCellIndex = indexPath
}
self.tableView.reloadData()
}
override func viewDidLoad() {
super.viewDidLoad()
tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 140
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
I couldn't get the same output as the answer suggested.
My Output
Thank you so much!

Answer 1

Here is a simple code which will not only allow you to expand specific cell you can expand all the cell. In case you want to expand only one cell you can do that as well.
Step 1:
Declare two dynamic prototype cells in storyboard.
Lets call the red one as SimpleCell and Green one as ExpandedCell.
Step 2:
Add reusable identifier for each cell.
Step 3
Create custom classes for both these cells and created IBOutlets to labels.
Step 4:
Now write this in ViewDidLoad of your VC.
override func viewDidLoad() {
super.viewDidLoad()
tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 140
}
Step 5:
Assuming there can only be one cell expanded at a time I am declaring single IndexPathVariable you can always declare array if you want multiple cells expanded.
var expandedCellIndex : IndexPath? = nil
Step 6:
Write tableView data source code.
override func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 5
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
var cell : UITableViewCell! = nil
if indexPath == expandedCellIndex {
cell = tableView.dequeueReusableCell(withIdentifier: "expandedCell") as! ExpandedTableViewCell
(cell as! ExpandedTableViewCell).label1.text = "abcd"
(cell as! ExpandedTableViewCell).label2.text = "Efgh"
(cell as! ExpandedTableViewCell).label3.text = "xyz"
}
else {
cell = tableView.dequeueReusableCell(withIdentifier: "simpleCell") as! SimpleTableViewCell
(cell as! SimpleTableViewCell).label.text = "abcd"
}
return cell
}
Step 7:
I am expanding cell on cell tap you can do it on button tap as well :) write this logic in IBAction of button lemme write it in didSelectRow.
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
if self.expandedCellIndex == indexPath {
self.expandedCellIndex = nil
}
else {
self.expandedCellIndex = indexPath
}
self.tableView.reloadData()
}
Conclusion :
Disclaimer
I am using Dynamic cell height hence has not written heightForRowAtIndexPath as height of the cell will be automatically calculated.
If you are using any UIComponents in cell which does not have implicit size, you might have to implement heightForRowAtIndexPath as below.
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if self.expandedCellIndex == indexPath {
return expnadedCellHeight
}
else {
return simpleCellHeight
}
}