How do I pan the image inside a UIImageView?

cocoa-touch core-animation
TALlama picture TALlama · Jan 7, 2009 · Viewed 45.2k times · Source

I have a UIImageView that is displaying an image that is wider and taller than the UIImageView is. I would like to pan the image within the view using an animation (so that the pan is nice and smooth).

It seems to me that I should be able to just adjust the bounds.origin of the UIImageView, and the image should move (because the image should paint inside the view with that as its origin, right?) but that doesn't seem to work. The bounds.origin changes, but the image draws in the same location.

What almost works is to change the contentsRect of the view's layer. But this begins as a unit square, even though the viewable area of the image is not the whole image. So I'm not sure how I would detect that the far edge of the image is being pulled into the viewable area (which I need to avoid, since it displays by stretching the edge out to infinity, which looks, well, sub-par).

My view currently has its contentsGravity set to kCAGravityTopLeft via Interface Builder, if that makes a difference (Is it causing the image to move?). No other options seemed to be any better, though.

UPDATE: to be clear, I want to move the image inside the view, while keeping the view in the same spot.

Answer

Brad Larson picture Brad Larson · Jan 7, 2009

I'd highly recommend enclosing your UIImageView in a UIScrollView. Have the UIImageView display the full image, and set the contentSize on the UIScrollView to be the same as your UIImageView's size. Your window into the image will be the size of the UIScrollView, and by using scrollRectToVisible:animated: you can pan to particular areas on the image in an animated fashion.

If you don't want scroll bars to appear, you can set the showsHorizontalScrollIndicator and showsVerticalScrollIndicatorproperties to NO.

UIScrollView also provides pinch-zooming functionality, which may or may not be useful to you.

Related questions

iPhone UIView Animation Best Practice

What is considered best practice for animating view transitions on the iPhone? For example, the ViewTransitions sample project from apple uses code like: CATransition *applicationLoadViewIn = [CATransition animation]; [applicationLoadViewIn setDuration:1]; [applicationLoadViewIn setType:kCATransitionReveal]; [applicationLoadViewIn setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]]; [[myview layer] addAnimation:…

Read More
How do I apply a perspective transform to a UIView?

I'm looking to perform a perspective transform on a UIView (such as seen in coverflow) Does anyonew know if this is possible? I've investigated using CALayer and have run through all the pragmatic programmer Core Animation podcasts, but I'm still …

Read More
Fade In Fade Out Animation

Here is some code I struggle with for a while. If you start the fade in animation, the label text fades in. If I start the fade out animation the the label text fades out. When I start the startFade …

Read More