Expanding content using UITableView, UIStackView in Storyboard with AutoLayout

Question

jpsscott OP

Created Feb ’16

Replies 1

Boosts 0

Views 2.9k

Participants 3

I have a UITableViewController that I want to display a list of items in as part of my storyboard.

Each item also has a "details" section you can expand. Since this is just a test view it has a pretty simple layout:

UITableViewController

TableView/Cell/ContentView

Vertical Stack View

Details button

UITableView/Cell/ContentView

Label with details

I'd like the details collapsed by default and when the details button is clicked it will expand and show the details.

I have used Auto-layout and made sure that all vertical constraints are accounted for. I have also adjusted Vertical Content Compression Resistance to be above the normal defaults, but nothing seems to work. (When I click my details button I can see 1 tableView cellForRowAtIndexPath call and that's it. Nothing is ever visible on screen.

Is this interface even possible? Can anyone recommend a way to accomplish this?

Thanks,

James

Answered by junkpile in 108885022

I wouldn't recommend a second table view within a table view cell. They would both be trying to respond to scroll gestures, and a table view doesn't know how to size itself to fit its content, so you'd have to write some hacky code to do that (adding up row heights + separators + headers / footers etc.)

You could just add some more rows in your top-level table view, or just add the UIStackView with the nested detail "row"s in your cell. I believe to force the table view to recalculate row heights you should call beginUpdates / endUpdates. The solution you choose might depend on whether the user is supposed to be able to select individual detail rows. If so then I would recommend adding additional rows in the table. That's the way I've done it for a hierarchical picker type UI.

Boost

Answer 1

junkpile OP

Feb ’16

Accepted Answer

I wouldn't recommend a second table view within a table view cell. They would both be trying to respond to scroll gestures, and a table view doesn't know how to size itself to fit its content, so you'd have to write some hacky code to do that (adding up row heights + separators + headers / footers etc.)

You could just add some more rows in your top-level table view, or just add the UIStackView with the nested detail "row"s in your cell. I believe to force the table view to recalculate row heights you should call beginUpdates / endUpdates. The solution you choose might depend on whether the user is supposed to be able to select individual detail rows. If so then I would recommend adding additional rows in the table. That's the way I've done it for a hierarchical picker type UI.

1