Lottie-Windows is a library (and related tools) for rendering Lottie animations on Windows 10 and Windows 11.
This list of changes was auto generated.
This list of changes was auto generated.
-DisableLottieMergeOptimization argument.This release contains major LottieGen optimizer changes. For animations that have many states (or top-level PreComp layers) Lottie-Windows now will generate about 40-50% more simpler visual trees.
Now Lottie-Windows also supports Round Corners effect and blur/shadow effects are now supported for Shape layers.
This list of changes was auto generated.
This list of changes was auto generated.
This list of changes was auto generated.
This list of changes was auto generated.
Along with the usual slew of bug fixes and more support of After Effects features, the Lottie-Windows version 7.0 release has been focused on making Lottie more compelling for use within Windows UI features. Lottie-Windows is now an important part of the new WinUI AnimatedIcon story that will allow animations in many places where static glyphs were previously used.
Lottie-Windows is unique in its ability to translate Lottie files into code that takes advantage of Windows’ awesome compositor and animation engine. This allows Lottie to be used in places that could never afford the runtime overhead of a regular Lottie player.
Here are some highlights to that end:
The integration of Lottie into UI features mandates the ability to do color binding. Color binding is where certain parts of the Lottie are tied to system theme colors (for example the user’s foreground or accent colors). Lottie-Windows now supports 2 types of color binding: explicit, and automatic.
Explicit color binding allows the designer to annotate their After Effects project to indicate which parts require binding. This is done with a CSS-like syntax added to the comments on the After Effects elements. For example, to indicate that a fill should be bound to the Foreground color, the designer simply needs to add this annotation to the fill: “{color:var(Foreground);}”. This will cause a property called “Foreground” to be added to the generated code which the user can then set. AnimatedIcon uses this facility to automatically bind system colors to animated icons.
Automatic color binding handles the case where you don’t have access to the After Effect project. With automatic color binding, a property for each unique color will be added to the generated code allowing you to modify each color at runtime.
Note that color bindings in other Lottie systems rely on runtime modification of JSON or handling per-frame callbacks. Such techniques are at odds with Lottie-Windows’ focus on runtime performance.
LottieGen has always supported code generation for C# and C++/CX, with only limited support for C++/WinRT. With version 7.0 C++/WinRT has become a first class citizen, and supports all of the features of the other languages.
Ever wanted to just drop a Lottie file into your Visual Studio project and have LottieGen automatically turn it into high performance generated code that you can reference directly in your XAML? With the MsBuild Task available via NuGet we’ve gotten closer to that dream. LottieGen.MsBuild packages the LottieGen tool into an MsBuild Task that can be called from your MsBuild project and targets files.
We still need to write a .targets file that will make this completely automatic. If you start writing your own, please consider sharing it!
By the way, in order to enable LottieGen to be packaged in this way, we’ve started building LottieGen as a standalone .exe. If you find that convenient (i.e. if you don’t want to depend on .NET 5 being installed), you can grab the .exe out of the NuGet package for use in your development workflow.
As ever, we’ve improved compatibility and added more missing Lottie features. Compatibility is something that all Lottie players aspire to, but the reality for Lottie is that it can never be 100% due to the open-ended nature of the After Effects object model and the lack of standardization of the Lottie format. Compatibility will be an ongoing effort, so if something doesn’t work quite right, please give us feedback on Github so we can prioritize your case.
For this release, more things should work better, and we’ve started to add support for layer effects. We’ve added support for Gaussian Blur effects so far, and the infrastructure to support more effect types.
Here’s a summary of what’s new in 7.0:
This release brings a new theme property binding feature, better Lottie feature support, performance improvements and bug fixes.
Theme property binding
This feature enables properties in Lottie files to be bound to values at runtime. This enables scenarios such as synchronizing colors in your Lottie file to the Windows theme colors.
Theme property binding was developed to support fill color binding, however it also supports StrokeWidth and opens the door to enabling other property bindings.
To make an After Effects color fill bound to a property at runtime, the name of the fill needs to include (CSS-like) syntax such as the following: "{color:var(Foreground)}". This will create a property in the generated code called "Foreground".
Property binding default values are exposed as constants. This allows these default values to be used in supporting code without having to instantiate the IAnimatedVisualSource object.
The ColorAsVector4(…) method in generated code is to help developers set color properties. Due to a limitation of the Windows.UI.Composition APIs, we can't use the Windows.UI.Xaml.Color type for doing property binding. We use Vector4 instead and this method ensures the conversion from color to Vector4 is done the same way by developers as is expected by generated code.
Lottie feature support
Code generation
Rich generated comments about the Lottie contents, and the code generation.
New code generation options.
Code quality improvements.
C++/WinRT
Metadata handling
Parser performance
Lottie Viewer
Bug fixes
platforms & tooling :rocket:
improvements
other fixes