search

microsoft / react-native-windows

A framework for building native Windows apps with React.
https://microsoft.github.io/react-native-windows/
Other
16.35k stars 1.14k forks source link

Use Fluent Lottie Animation for Fabric ActivityIndicator #11566

Open TatianaKapos opened 1 year ago

TatianaKapos commented 1 year ago

Summary

Fabric ActivityIndicator is currently a simple comp animation but we should use the more modern Lottie animation in the future. This is dependent on SVG and adopting FURN control but we can track the progress here.

Motivation

To make fabric RNW more modern

Basic Example

https://learn.microsoft.com/en-us/windows/winui/api/microsoft.ui.xaml.controls.progressring?view=winui-2.8

chrisglein commented 1 year ago

By using the same Lottie animation that's used by WinUI we will match whatever the current Fluent design standard is (which could change in the future). They use Lottie to code gen composition calls: https://github.com/microsoft/microsoft-ui-xaml/blob/main/dev/ProgressRing/AnimatedVisuals/ProgressRingIndeterminate.h Which (with some adaptation) should also be compatible with our composition-based version of RNW.