UIScrollView inside a movable UIView - ios

Question

I'm attempting to recreate the animation done in the Google Maps app that occurs when you select a location on the map. After selecting a location a UIView pokes up from the bottom of the screen. You can pull that up to reveal a UIScrollView with additional content. I'm curious how they make it so you can only scroll the content inside the UIScrollView when the parent view is at the "top". I understand that you could setScrollEnabled:, but they somehow do it on the fly so that when sliding your finger up the parent view "docks", and then the inner content scrolls, and when you are scrolling the content down, it stops once it reaches the top of the content and starts pulling the header down with it.
Any ideas?

Answer 1

I solved this problem by doing something like this: Create an animation that moves the scroll view's parent from the half-visible position to the top....
- (void)setScrollViewExpanded:(BOOL)expanded {
BOOL isExpanded = self.scrollViewContainer.frame.origin.y == 0.0;
if (isExpanded == expanded) return;
CGRect frame = self.scrollViewContainer.frame;
CGRect newFrame;
if (expanded) {
newFrame = CGRectMake(0, 0, frame.size.width, self.view.frame.size.height);
self.scrollView.delegate = nil;
self.scrollViewContainer.frame = CGRectMake(0, frame.origin.y, frame.size.width, self.view.bounds.size.height);
self.scrollView.delegate = self;
} else {
newFrame = CGRectMake(0, 300, frame.size.width, frame.size.height);
}
[UIView animateWithDuration:1 animations:^{
self.scrollViewContainer.frame = newFrame;
} completion:^(BOOL finished) {
if (!expanded) {
self.scrollView.delegate = nil;
self.scrollViewContainer.frame = CGRectMake(0, 300, self.scrollViewContainer.bounds.size.width, self.view.bounds.size.height-300);
self.scrollView.delegate = self;
}
}];
}
Trigger the animation based on change in scroll view's content offset relative to the top...
-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
if (scrollView.contentOffset.y > 10.0) {
// 10 is a little threshold so we won't trigger this on a scroll view
// "bounce" at the top. alternatively, you can set scrollView.bounces = NO
[self setScrollViewExpanded:YES];
} else if (scrollView.contentOffset.y < 0.0) {
[self setScrollViewExpanded:NO];
}
}
Edit: I changed the expand animation after rechecking my old code. It needs to be a little more complex due to feedback on the content offset while changing the frame. The edit doesn't change the size during the animation, just the origin. It changes the size before or after the animation and blocks the delegate messages temporarily. Also note the scroll view's autoresize mask should be set to fill the container view.