08. Animation

The animation feature allows you to transition the scale or image position from a subclass or activity. This might be useful if you want to create an animated tour of a large map, or highlight points of the image in response to button taps. You could also use animation to implement zoom and pan buttons for a map.

The view has options to disable pan and zoom gestures so you can disable all interaction and only allow the image to be moved and scaled by your own code.

There are three methods you can use to create an animation, depending on whether you want to animate the scale, center, or both. These methods return an animation builder, on which you can set additional options before starting the animation.

Example

pinView.animateScaleAndCenter(2f, new PointF(1500, 1000))
    .withDuration(2000)
    .withEasing(SubsamplingScaleImageView.EASE_OUT_QUAD)
    .withInterruptible(false)
    .start();

Builder constructors

Method	Description
animateScale	Zoom in or out, centered on the current center point.
animateCenter	Pan the image to place the given source image coordinates in the center of the screen, maintaining the current scale.
animateScaleAndCenter	Simultaneously zoom and pan the image.

Options

Method	Description
withDuration(long)	Sets the duration of the animation in milliseconds. Default is 500.
withEasing(int)	Sets the easing style. Default is EASE_IN_OUT_QUAD. EASE_OUT_QUAD is also available.
withInterruptible(boolean)	Whether the animation can be interrupted by a touch. If set to false, the view will ignore all touch events until the animation completes.

Notes

By default, the view will stop panning when an edge of the image reaches the edge of the screen, so it isn't possible to animate a point near the edge of the image to the center of the screen. The animation builder automatically takes this into account, and will pan to place the requested point as near to the center of the screen as is possible. If you want to allow any point of the image to be centered on the screen, change the pan limit configuration as shown below. This stops panning when a corner of the image reaches the center of the screen.

view.setPanLimit(SubsamplingScaleImageView.PAN_LIMIT_CENTER);

If you start an animation while another is still running, the first animation will be interrupted (even if it was set to uninterruptible) and the second animation will start where the first left off.