lottie-flutter
lottie-flutter copied to clipboard
Lottie Animation Colors not showing properly
This is the lottie animation I am using through network: https://assets4.lottiefiles.com/private_files/lf30_8zscxore.json
And here's the code I used to render it in my flutter app
child: LottieBuilder.network(
'https://assets4.lottiefiles.com/private_files/lf30_8zscxore.json',
),
This is the screenshot from the app,

As you can see there is few shapes which are missing in screenshot compare to original animation.
But when I use delegates and change the color of the missing shapes is visible.
LottieBuilder.network(
'https://assets4.lottiefiles.com/private_files/lf30_8zscxore.json',
delegates: LottieDelegates(
values: [
ValueDelegate.colorFilter(
['circle 2', '**'],
value: const ColorFilter.mode(
Colors.blue,
BlendMode.hardLight,
),
),
],
),
),

The difference between visible and not visible shape in after effects is that the mode is "multiply" for non-visible shape and "normal" for visible ones.
Since Lottie Player is supporting this feature, Is there any way I can make lottie flutter plugin support it without using value delegates?