Baseflow / Baseflow/LottieXamarin

Lottie files with text don't play on Xamarin.iOS

Open
#306 2 comments 1 reaction 0 assignees View on GitHub
Dominant language
C#
Stars
1.2k
Forks
253
PR merge metrics
No merged PRs in 30d

Description

## 🐛 Bug Report

Some valid Lottie animations don't play back at all in LOTAnimationView on Xamarin.iOS. Based on limited data, it appears to be those that contain text.

Here is an example of a file that doesn't play back. This was exported from After Effects:
[tap-a-topic-EN.json.txt](https://github.com/Baseflow/LottieXamarin/files/5705708/tap-a-topic-EN.json.txt) _(File renamed with .txt extension to allow it to be attached here.)_
For this file, the animator created a text string and animated it to give a throbbing effect every 6 seconds. This file plays fine in other contexts like, for example, [this previewer](https://drawer.design/preview-lottie-animation/).

By contrast, here is another file that was also exported from After Effects. This one should look exactly the same as the one above, but in this case the animator converted the text to vector shapes. This file plays back perfectly using LottieXamarin:
[tap-a-topic-EN-shape-layer.json.txt](https://github.com/Baseflow/LottieXamarin/files/5705726/tap-a-topic-EN-shape-layer.json.txt)

**Note**: I see that the readme has a list of [Supported After Effects Features](https://github.com/Baseflow/LottieXamarin#supported-after-effects-features), and I don't see anything there about text. Is it possible that text in Lottie files is just not supported?

### Expected behavior

Any value Lottie file should be played back correctly.

### Reproduction steps

1. Create a Xamarin.iOS project for iPad in VS 2019
2. Use NuGet to add Com.Airbnb.iOS.Lottie
3. In a view controller, instantiate a LOTAnimationView, load the Lottie file, and add it to the visual tree. I used the following code
```
LOTAnimationView animation = LOTAnimationView.AnimationWithFilePath(pathToLottieAnimation);
animation.Frame = new CGRect(0, 0, 610, 50);
animation.ContentMode = UIViewContentMode.ScaleAspectFit;
animation.LoopAnimation = true;
container.AddSubview(animation);
animation.Play();
```
4. Run the application
5. Look at the screen

### Configuration

**Version:** Com.Airbnb.iOS.Lottie 2.5.13

**Platform:**
- [X] :iphone: iOS (specifically, iPad)
- [ ] :robot: Android
- [ ] :checkered_flag: WPF
- [ ] :earth_americas: UWP
- [ ] :apple: MacOS
- [ ] :tv: tvOS
- [ ] :monkey: Xamarin.Forms

Contributor guide

Open the contributing guide

Research direction

Start with the LOTAnimationView usage in the reproduction steps and compare the attached text-layer and shape-layer Lottie files on Xamarin.iOS using Com.Airbnb.iOS.Lottie 2.5.13. Confirm whether the text-containing animation fails while the shape-layer version plays, then trace the relevant playback path. Done means valid text-containing Lottie files play back correctly on iPad.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp, ios
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.