Nested UIScrollView prevent bounce bubbling and allow parent paging when at end of list

Question

I want to recreate the same behavior as the stock weather app in iOS7. Here is a screen shot:

The main screen is a UIScrollView that pages which contains a nested UIScrollView that scrolls left and right.

I've implemented this a bunch of ways but am not getting the experience quite right. If I just do something like this:

| UIScrollView
| ---> UICollectionView

When I swipe left and right fast it will cause the parent screen to bounce too causing you to see next page. I don't want this. I have tried using all the delegates to try and disable the parent while the child is scrolling but this never behaved performant and felt clumsy.

I then nested the UICollection view in another UIScrollView and this stops the bouncing traveling up. However when the UICollectionView settles at the end I should be able to scroll right and page the parent UIScrollView. This does not happen.

All I can seem to do is have no bounce travel up to parent or allow parent paging when child is at either end. How do I get both these behaviors? Play with the stock iPhone weather app on iOS7 and you can see what I would like. Thanks for any direction or help.

Answer 1

Nest your scrollview in another scrollview that has bounces set to no.

Parent_scrollview
  container_scrollview->bounces no
    child_scrollview

The behavior of a scrollview is if it bounces, to find another scrollview that's higher up in the hierarchy and try to scroll it. If you put in a container scrollview that doesn't bounce, the parent will never get the child's bounce request.