[BUG] Unable to display Lottie Animation within Popup

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

I would like to display a Lottie animation within a popup, however, the animation is loaded only on iOS. Android and macOS do not load the Lottie Animation.

Android - The image is not rendered at all. iOS - The image renders and animates properly. macOS - The image renders without animation.

Please find below a couple of videos showing the issue

https://user-images.githubusercontent.com/1047398/192577026-1872d522-ec10-47d1-bf1a-985ce64643fd.mov

https://user-images.githubusercontent.com/1047398/192577040-89014a88-d76d-4951-8f79-0b82fd14384d.mp4

Expected Behavior

It is expected the Lottie animation to be rendered properly in all platforms within a popup.

Steps To Reproduce

1. Create a new MAUI project
2. Add CommunityToolkit.Maui nuget package
3. Add SkiaSharp.Extended.UI.Maui nuget package (preview)
4. Create a CommunityToolkit Popup view and add the following code: <skia:SKLottieView Source="loading.json" WidthRequest="200" HeightRequest="200" RepeatCount="-1" VerticalOptions="Center" HorizontalOptions="Center"/>
5. Use the following Lottie file as animation (Download the JSON file): https://lottiefiles.com/97952-loading-animation-blue
6. Include the json file into the folder /Resources/Raw
7. Mark the json file as build action > MauiAsset
8. Create a page with a button that shows the popup view on a click event

Link to public reproduction project repository

https://github.com/mono/SkiaSharp.Extended/files/9577812/SKLottieViewBug.zip

Environment

- .NET MAUI CommunityToolkit: 1.2.0
- OS:macOS Monterey 12.6
- .NET MAUI: 6.0.486
- SkiaSharp.Extended.UI.Maui 2.0.0-preview.61

Anything else?

Thanks in advance for this AMAZING library!

[bijington]

Hey @vhugogarcia! We don’t have any Lottie tooling in the .NET MAUI Community Toolkit.

Did you perhaps intent to open this Issue on the .NET MAUI repo or the SkiaSharp.Extended repo?

I suggested he open it here. I don’t know where the issue lies yet but for now the issue is that the Lottie animation render fine in a .NET MAUI app but not in the toolkits Popup.

[VToegel]

@vhugogarcia I tested it on windows and it does work too.

Rgds Vinc