How to use FLAnimatedImage with SwiftUI

Maturador
Maturador
Nov 8 · 3 min read

If this is the first time you come across FLAnimatedImage, please read this great tutorial before proceeding https://medium.com/swift-sundae/ultimate-guide-to-gifs-in-ios-f903ab69ddf6. It helped me a lot!

When SwiftUI was introduced, I was determined to use it in the development of my next app. But the problem was that I didn’t know how to do it without depriving myself of some of my favorite libraries. It took me some time to get used to SwiftUI and get my mind out of “the traditional way” of creating IOS apps.


So now I want to share some of the things I learned.

After Step 4 of the above-mentioned tutorial, follow these steps:

Step 5: Create a new Swift File.

Let’s call it AnimatedImageView.

Step 6: Create AnimatedImageView struct.

Step 7: Inherit from UIViewRepresentable

The first thing I do, when coming across something unfamiliar, is to check it in the documentation.

So, this protocol allows us to use all UIKit objects that are not natively integrated into SwiftUI. By adopting UIViewRepresentable, we are required to implement two methods: makeUIView and updateUIView.

If you want to learn more about this protocol, check this out https://medium.com/@valv0/textfield-and-uiviewrepresentable-46a8d3ec48e2

Now, let’s go back to our app. If you have done everything right, this is what you should see:

Step 8: Follow these steps:

Step 9: Use it.

We can load every gif we want, just by writing its name.


I hope you enjoyed this tutorial. See you soon!

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade