animate rotation UIImageView in swift
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
Introduction
Rotating a UIImageView is a common pattern for loaders, status icons, and lightweight interaction feedback in iOS apps. The right implementation depends on whether you need a one-off turn, a continuous spinner, or a rotation that can pause and resume cleanly. In practice, UIView animation works well for finite transforms, while Core Animation is better for indefinite spinning.
Finite Rotation with UIView.animate
If you only need to rotate once or a small number of times, animating the view transform is the simplest approach.
This is good for:
- Expanding disclosure arrows.
- Toggling icons between states.
- Simple rotation effects paired with other layout changes.
Because it modifies the transform directly, it composes naturally with ordinary view animations.
Continuous Spinning with Core Animation
For loader-style indefinite rotation, Core Animation is usually the better tool because it runs efficiently and avoids repeatedly updating the transform on the main thread.
This is the standard pattern for a smooth infinite spinner.
Avoid Snap-Back When Stopping
One visual issue with Core Animation is that the view may jump back to its original orientation when you remove the animation. If you want the image to stop exactly where it is, copy the current presentation-layer rotation into the view transform before removing the animation.
That keeps the final frame visually stable instead of snapping to zero rotation.
Lifecycle and Visibility
If the image is part of a loading indicator, animation should be tied to visibility and actual work state. Starting animations too early or leaving them running off-screen wastes resources and can produce confusing UI state.
Typical pattern:
If animation is tied to a network request instead, start and stop it from the request lifecycle rather than the screen lifecycle.
Auto Layout and Rendering Considerations
Rotation does not change constraints. Auto Layout still lays out the untransformed bounds, and the visual rotation happens afterward. That is usually fine, but clipped edges can appear if the container is too tight or clipsToBounds is enabled on a parent view.
Also check:
- '
contentModeof the image view.' - Whether the image has enough padding around edges.
- Whether several rotations are being applied cumulatively.
Repeated transform changes without resetting state can make the final orientation hard to reason about.
Accessibility and Motion Settings
Continuous spinning can be distracting for users who prefer reduced motion. Respect system accessibility settings where appropriate.
That is especially important for long-lived loading indicators or decorative animations.
Common Pitfalls
- Using repeated timer-based transform updates for an infinite spinner. Fix by using Core Animation instead.
- Re-adding the same animation every time state changes. Fix by guarding with an animation key check.
- Removing an infinite animation and accepting a visible snap-back. Fix by copying the presentation-layer angle before removal.
- Starting animation before the view is actually visible. Fix by tying animation to a clear lifecycle or loading-state boundary.
- Ignoring reduced-motion accessibility settings. Fix by providing a non-rotating fallback for users who disable motion-heavy effects.
Summary
- Use
UIView.animatefor simple finite rotations. - Use
CABasicAnimationfor efficient continuous spinning. - Preserve the current presentation angle if you need a smooth stop.
- Tie rotation lifecycle to visibility or request state, not arbitrary callbacks.
- Respect accessibility motion settings and avoid unnecessary animation churn.

