How to resize items in collection view to perfectly fit bigger screen sizes?

I have a collection view with vertical flow layout. On bigger iPhones there is empty space after the 5 items in the row. Height and width and fixed at 30. There is empty space horizontally after the 5th item in the row. If i turn height and width constraint to be 'greater that of equal to' then i see just 3 items in the row and the remaining 2 appear in the row below.

I find constraints very challenging and want guidance with setting them right so that the items resize on all screens to have exactly 5 items in a row from edge to edge of the collection view.

Up vote post of ace.neerav Down vote post of ace.neerav
996 views
Posted by
ace.neerav
Reply
Add a Comment

Replies

iPhone SE

iPhone 14 Pro Max

Posted by
ace.neerav
Up vote reply of ace.neerav Down vote reply of ace.neerav
Add a Comment

If you want to keep the itemSize same across devices you should consider calculating the interitemspacing based on the collection view content width. If you want to keep the interitemspacing same then calculate the itemSize based on the collection view content width. This is assuming you always want the same number of items on each row.

Alternately consider using Compositional Layout which provides more flexibility in configuring collection view layouts. Compositional Layout

Posted by
anils
Up vote reply of anils Down vote reply of anils

  • " If you want to keep the inter item spacing same then calculate the itemSize based on the collection view content width". that is what I want? Can you give me sample code? is it same as frame.size.width?

    —
    ace.neerav
Add a Comment