Put UICollectionView within UITableViewCell

Question

hgl OP

Created Mar ’18

Replies 3

Boosts 0

Participants 2

Hi, I'm trying to create a table view with cell content like this

| Label                                                 |
| CollectionItem 1   CollectionItem 2  CollectionItem 3 |
| CollectionItem 4                                      |

Collection view item should auto wrap at cell end, both the collection view and table view use automatic height.

I can somewhat achieve this effect by doing:

- put the label and the collection view in a vertical stack view, make the stack view's each edge touchs table cell's corresponding edge.

- diable collection view scrolling.

- collection view's intrinsicContentSize returns layout's collectionViewContentSize value.

- in table cell's prepareForReuse method, I make the collection view reload its data.

But the problem comes when each table cell can contain different number of collection items: some table view cells have incorrect heights, clipping its collection view. My guess is that when table cells get reused, they don't take collection view's new intrinsicContentSize into account.

I tried calling sizeToFit/layoutIfNeeded/updateConstraints in cell's prepareForReuse method, none of them works.

If I replace the collection view with a multiline label, and make each cell contain different length of text, the cells all have correct heights.

I wonder why label are able to correctly resize cells? how can I make collection views do the same?

Thanks very much.

Boost

Answer 1

QuinceyMorris OP

Mar ’18

It may be a constraint priority issue, either the default value for content hugging or compression resistance, or the relationship between constraint priorities and the fixed priority values here: https://developer.apple.com/documentation/appkit/nslayoutconstraint.priority

Wouldn't be easier, though, to just use a collection view, without the table view? Each section of the collection view contain what's currently in each row of the table view. (If the table view itself has sections, you should be able to get that effect in a collection view with a non-standard layout, or with supplementary views.)

It looks to me like you might have a standard horizontal flow layout, and working with just a collection view would be easier than working with a collection view plus a table view.

0

Answer 2

hgl OP

Mar ’18

QuinceyMorris, thanks for the quick reply.

I'm not sure I understand how constraint priority comes into play here. Since the table view cell uses automatic height, the collection view should not be stretched or compressed verticlally.

I did go ahead and gave collection views's CR value a default high, but it doesn't seem to help.

Just using a collection view won't work for me, because i actually also need section header and section index titles, which are probably not easy to implement with collection view.

0

Answer 3

QuinceyMorris OP

Mar ’18

Collection views have section index titles, too:

https://developer.apple.com/documentation/uikit/uicollectionviewdatasource/2851455-indextitles

Given the structure you describe, I would suggest you consider using collection view sections for your "table sections", and use collection view supplementary views for your "collection section" headers.

There's a bit of a learning curve in customizing collection view layout, but it may be preferable to the world of pain that is layout constraint priorities. 😉

0