iosobjective-cuiscrollviewquartz-core

Animate objects when UIScrollView scrolls


I have a UIScrollView which has two pages and only scroll horizontally.

The scrolling and paging is controlled using a UIPageControl. I have placed a UIImageView on the scrollView which contains an image of an iPhone (shown in red in the image below) that says Hello inside page 1.

I wanted to animate the UIImageView to rotate and change its position as shown in the image when the user scrolls from page-1 to page-2. Also the animation should ideally rotate back when the user is scrolling back from page-2 to page-1.

Animation based on UIScrollView

The animation or movement of the UIImageView is based on how much the user is scrolling horizontally and not based on time.

How can I rotate the UIImageView back and forth based on the scroll position of the UIScrollView?


Solution

  • Set a delegate for your scroll view. Probably you want your view controller to be the delegate. You need to add UIScrollViewDelegate to its list of protocols.

    Then, in the delegate, implement scrollViewDidScroll:. In scrollViewDidScroll:, look at the scroll view's contentOffset. Based on the contentOffset, set the image view's transform and center to rotate and move it where you want.