DEV Community

Cover image for Pausing UIImageView animation in Xamarin.iOS
Michał Żołnieruk
Michał Żołnieruk

Posted on • Originally published at codingwithmiszu.com

1 1

Pausing UIImageView animation in Xamarin.iOS

First things first — did you know that you can use UIImage to show frame-by-frame animations? It’s actually quite straight forward, all you need to do is:

  • Prepare your frames in png format, name them using an ordering convention (for example “Frame1.png”, “Frame2.png”, …)
  • Add these images to your Xamarin.iOS project, let’s say to Resources/Animation folder
  • Make sure all of your images are referenced as BundleResource in your csproj:
<ItemGroup>  
  <BundleResource Include="Resources\\Animation\\\*.png" />  
</ItemGroup>
Enter fullscreen mode Exit fullscreen mode
  • Load your images as UIImage and pass them to the UIImageView using AnimationImages property:

Add animatedImageView to your controller and here’s what you will see:

UIImageView animation running on iPhone simualator

Great, it’s alive! 🧟‍♂️ What if you’d like to pause the animation on tap and then resume it after another tap? Sadly, there’s no API for this in the UIImageView, but there is a way to accomplish it using UIImageView’s Layer.

I’ve found it described in one of the Technical Q&As on developer.apple.com. This Objective C code may not be so easy to rewrite to C#, especially if you’re just getting started, so below is a working solution in Xamarin.iOS. You may want to polish the code a bit (extracting StopAnimation/StartAnimation extension methods may be a good start).

Now you should be able to pause/resume the animation with taps:

Animation can now be paused with a tap

Do I need to add my frames as iOS Assets? It’s kind of tedious with so many files!
No, you can just drag and drop the whole folder to Resources, remember to reference files as BundleResource.

The animation is not pausing when I tap it, what’s wrong?
You might have forgotten to set UserInteractionEnabled to true on the UIImageView.

I hope that this quick tutorial was helpful to you. Let me know if something is not clear. Follow me on Twitter for more insights about mobile dev and other tech 🚀

Image of Wix Studio

2025: Your year to build apps that sell

Dive into hands-on resources and actionable strategies designed to help you build and sell apps on the Wix App Market.

Get started

Top comments (0)

Sentry mobile image

Improving mobile performance, from slow screens to app start time

Based on our experience working with thousands of mobile developer teams, we developed a mobile monitoring maturity curve.

Read more

👋 Kindness is contagious

Engage with a sea of insights in this enlightening article, highly esteemed within the encouraging DEV Community. Programmers of every skill level are invited to participate and enrich our shared knowledge.

A simple "thank you" can uplift someone's spirits. Express your appreciation in the comments section!

On DEV, sharing knowledge smooths our journey and strengthens our community bonds. Found this useful? A brief thank you to the author can mean a lot.

Okay