Two UIViews & one UICollectionView inside UIScrollView (or better approach)

Question

I need to have iOS app with screen like this:

screen

The idea is when user start to scroll down the first UIView to move up until the second UIView reach the top where it will stick and only UICollectionView will continue to move up.

Currently I'm using this structure

• UIScrollView (main scroll)
  • UIView (some banners)
  • UIView (UISegmentedControl)
  • UICollectionView (grid with items, scroll is disabled, main scroll is used)

I manage to do it, but I needed to set UICollectionView height constraint manually in the code (calculated based on all items in grid) in order to appear in UIScrollView (everything else is handled by AutoLayout in Storyboard). The problem with this is that UICollectionView think all cells are visible and load them, so the whole recycling & reusing thing does not work. It's even worst because I use willDisplayCell method on UICollectionView to load more data when last cell is displayed, but now it load all pages at once.

My question (actually they are 2)

1. How can I fix the issue above?
2. What is the right way to achieve this functionality? Maybe my whole approach is conceptually wrong?

Answer 1

Collection view is a scroll view itself. So maybe you could have same functionality only with Collection view with sections or even custom layout?