Embedding a UICollectionView in a UIScrollView works almost perfectly

Question

Background

I embedded a UICollectionView inside of a UIScrollView and it works almost perfectly.

Goal

The scrollable elements should pass off the scroll seamlessly once they've reached the end of their contentViews. When I swipe down on the UIScrollView it should scrolls down so that the UICollectionView takes up ~90% of the screen and then continues scrolling the collectionView. The reverse should be true as well, when I scroll up on the collectionView and reach the top of the collectionView content the scrollview should start scrolling up.

Problem

1) When I scroll up on the collectionView, it scrolls to the top and stops. If I flick down a couple times it still bounces the collectionView instead of scrolling the scrollView up. I have to tap the collectionView one more time "deliberately" in order to get the parent ScrollView to scroll up.

See gif:

I imagine it has something to do with CancelContentTouches but I haven't been able to get the correct combination.

2) Same thing when I scroll down, once the scrollview reaches the end of the contentView, it stops and bounces.

See gif:

Note: I realize it's not super recommended to put a UICollectionView in a UIScrollView. I tried alternatives listed below, but I wasn't able to achieve the desired effect by putting my top view in the header. I would like to be able to scroll both independently, so I decided to go with scrollview/collectionView combo.

View Hierarchy

MainViewController
- ScrollView
-- Profile Stats
-- CollectionViewContainerView
--- CollectionView

Resources other people looking to put collectionViews into scrollViews for some reason:
I tried them, but they didn't work for my use case.

• https://www.raywenderlich.com/156794/custom-uicollectionviewlayout-tutorial-parallax
• https://www.youtube.com/watch?v=ePCliV2CsuU&index=8&list=PL23Revp-82LKxKN9SXqQ5Nxaa1ZpYEQua

Huth

I am sure it is the first responder problem. Watching to see how you can pass it. Maybe at a certain offset you can use becomeFirstResponder(). Might have to combine resign first responder on the scrollview at the same time. And vice versa – Singlehearted

You can see the smooth scrolling in profile view of twitter's iOS app. I tried to replicate it and made same progress as you did, and then got stuck. I tried @abigson007's answer at the time i was developing this functionality but it didn't work coz the view above the CollectionView also needed to respond to scroll event. – Cayla

Did you ever end up figuring this one out? – Precessional

I have a similar problem I'm trying to solve, but I must embed the collectionView inside the scrollView because the component I'm using requires the use of a scrollView. Were you able to get this working? I have similar wonky scrolling in my app as well – Steinberg

Answer 1

If you are using scrollview or subclass of it in another scrollview or subclass of it then it is happen.

Now, you can do one thing. Disable scrolling for one (Inner scrollview recommended) and implement scrollview's delegate like scrollViewDidScroll or other which is more suitable and scroll the inner scrollview manually (by setting content offset of inner scrollview).

Korella