Expandable UITableViewCell
Introduction
Implementing an expandable table cell may cause a headache (as a programming at all) In this article we are going to make such cell in a pretty simple way.
Domain
First, we need to define a data to work with. They will be represented by News
struct. ViewData
class serves a decorator.
View controller is pretty simple. Acts as a dataSource
for tableView
, provides data and methods implementations.
Method tableView(_:cellForRowAt:)
is the most interesting here. it’s arguments are ViewData
object and closure. The latter accepts in parameters another closure, called callback. This closure is configured within cell, what we will see later. And this closure is invoked within performBatchUpdates(_:completion:)
method of tableView
, what makes the significant part of all the magic with expansion.
And now the most important part… cell.
In the configuration method we save completion, provided by the controller, and set isHidden
property of summaryLabel
to an appropriate relatively to the current item state.
The stored callback closure is invoked when the expandButton
is clicked. And as a parameter is passed another closure, where the rest part of the whole magic is happening.
First of we toggle the model expansion state. Then within animation method we set within isHidden
property of summaryLabel
appropriate inverted value of the current model. Inverted because the expanded state means no hidden labels.
Additionally we freeze titleLabel
height using constraint for a period of animation. It’s important because titleLabel’s bottom anchor is linked to mainStack’s top and when mainStack
recalculates it’s height, this action affects on the titleLabel
and makes it to recalculate it’s height too. And to prevent this we freeze height.
And result:
Outro
Hope this article was helpful and you found out to deal your problem. 😃