Animation in UIScrollView iOS app

Question

I'm developing an iOS app and i have a full screen UIScrollView with a UIImageView at the top and 2 UIButton in the bottom.

When the user scrolls i want to insert an animation on the image view (maybe only change the alpha parameter gradually).

The animation is correlated with the scrollview, for example, if the user scrolls the scrollview half, will be displayed only half animation.

I hope I explained myself.

How can i do this?

Answer 1

Use the UIScrollViewDelegate scrollViewDidScroll: method.

https://developer.apple.com/library/ios/documentation/uikit/reference/uiscrollviewdelegate_protocol/Reference/UIScrollViewDelegate.html#//apple_ref/occ/intfm/UIScrollViewDelegate/scrollViewDidScroll:

But also check out other methods in that delegate.

So for example, you may end up with something like (or change this to your needs):

-(void)scrollViewDidScroll:(UIScrollView*)scrollView {

    float opacity = ( 100 - scrollView.contentOffset.y ) / 100.0; 
    opacity = (opacity < 0? 0 : opacity>1? 1 : opacity);
    imageView.layer.opacity = opacity;

}

You might also want to learn from Apple engineers themselves. Check out the WWDC videos, there are many of them:

• Exploring Scroll Views on iOS 7 (WWDC 2013)
• Enhancing User Experience with Scroll Views (WWDC 2012)
• Advanced ScrollView Techniques (WWDC 2011)

Answer 2

Implement the UIScrollView Delegate protocol and use this method

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{

}

Here you can change the alpha value of your UIImageView by adjusting the opacity of the view's layer:

imageView.layer.opacity = ...

That's called an implicit animation.