Added a Lottie double pulse animation for newly-posted StatusCenter progress banners

Files/Assets/AnimatedVisuals/LottiePulseStatusCenter.json

@@ -0,0 +1 @@
+{"v":"5.5.7","fr":30,"ip":0,"op":60,"w":24,"h":24,"nm":"Comp 2","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"pointer","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[12.3805,11.447,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.412,0.412,0.833],"y":[0.998,0.998,3.63]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[5,5,100]},{"i":{"x":[0.548,0.548,0.833],"y":[1.001,1.001,-2.565]},"o":{"x":[0.951,0.951,0.167],"y":[-0.004,-0.004,-3.006]},"t":28,"s":[8.3095,8.3095,100]},{"t":60.0000024438501,"s":[5,5,100]}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[91.375,91.375],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-1.522,2.212],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[105.072,104.426],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":150.000006109625,"op":150.000006109625,"st":0,"bm":0,"hidden":0},{"ddd":0,"ind":2,"ty":4,"nm":"pulse","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[100]},{"t":31.0000012626559,"s":[0]}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[12.3805,11.447,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[5,5,100]},{"t":31.0000012626559,"s":[25,25,100]}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[91.375,91.375],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0.47058823529411764,0.8431372549019608,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-1.522,2.212],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[105.072,104.426],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":150.000006109625,"st":0,"bm":0}],"markers":[]}

Files/Files.csproj

@@ -370,6 +370,7 @@
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
     <Content Include="Assets\Custom Glyphs\fluentui.ttf" />
+    <Content Include="Assets\AnimatedVisuals\LottiePulseStatusCenter.json" />
     <None Include="Assets\terminal\terminal.json">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </None>
@@ -683,6 +684,9 @@
     <PackageReference Include="Microsoft.Toolkit.Uwp.UI.Controls.DataGrid">
       <Version>6.1.1</Version>
     </PackageReference>
+    <PackageReference Include="Microsoft.Toolkit.Uwp.UI.Lottie">
+      <Version>6.1.0</Version>
+    </PackageReference>
     <PackageReference Include="Microsoft.UI.Xaml">
       <Version>2.4.3</Version>
     </PackageReference>

Files/MultilingualResources/Files.hu-HU.xlf

@@ -1445,4 +1445,4 @@
       </group>
     </body>
   </file>
-</xliff>
+</xliff>

Files/UserControls/StatusBarControl.xaml

@@ -5,7 +5,9 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:local="using:Files.UserControls"
     xmlns:local1="using:Files"
+    xmlns:lottie="using:Microsoft.Toolkit.Uwp.UI.Lottie"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
     d:DesignHeight="40"
     d:DesignWidth="400"
     mc:Ignorable="d">
@@ -141,32 +143,39 @@
                     </MenuFlyout>
                 </Button.Flyout>
             </Button>
-
-            <Button
-                x:Uid="StatusCenter"
-                Width="34"
-                Height="30"
-                Margin="2,0,2,0"
-                AutomationProperties.Name="Status center"
-                Background="Transparent"
-                Content="&#xF16A;"
-                CornerRadius="2"
-                FontFamily="Segoe MDL2 Assets"
-                FontSize="16"
-                Style="{StaticResource ToolBarButtonStyle}"
-                ToolTipService.ToolTip="Ongoing tasks"
-                Visibility="Visible">
-                <Button.Flyout>
-                    <Flyout>
-                        <local:StatusCenter
-                            x:Name="OngoingTasksControl"
-                            Width="300"
-                            MinHeight="300"
-                            MaxHeight="400"
-                            x:FieldModifier="public" />
-                    </Flyout>
-                </Button.Flyout>
-            </Button>
+            <Grid>
+                <muxc:AnimatedVisualPlayer
+                    x:Name="StatusCenterPulseVisualPlayer"
+                    AutoPlay="False"
+                    Visibility="Collapsed">
+                    <lottie:LottieVisualSource x:Name="StatusCenterPulseVisualSource" UriSource="ms-appx:///Assets/AnimatedVisuals/LottiePulseStatusCenter.json" />
+                </muxc:AnimatedVisualPlayer>
+                <Button
+                    x:Uid="StatusCenter"
+                    Width="34"
+                    Height="30"
+                    Margin="2,0,2,0"
+                    AutomationProperties.Name="Status center"
+                    Background="Transparent"
+                    Content="&#xF16A;"
+                    CornerRadius="2"
+                    FontFamily="Segoe MDL2 Assets"
+                    FontSize="16"
+                    Style="{StaticResource ToolBarButtonStyle}"
+                    ToolTipService.ToolTip="Ongoing tasks"
+                    Visibility="Visible">
+                    <Button.Flyout>
+                        <Flyout>
+                            <local:StatusCenter
+                                x:Name="OngoingTasksControl"
+                                Width="300"
+                                MinHeight="300"
+                                MaxHeight="400"
+                                x:FieldModifier="public" />
+                        </Flyout>
+                    </Button.Flyout>
+                </Button>
+            </Grid>
         </StackPanel>
     </Grid>
 </UserControl>

Files/UserControls/StatusBarControl.xaml.cs

@@ -18,6 +18,20 @@ public sealed partial class StatusBarControl : UserControl
         public StatusBarControl()
         {
             this.InitializeComponent();
+            OngoingTasksControl.ProgressBannerPosted += OngoingTasksControl_ProgressBannerPosted;
+        }
+
+        private void OngoingTasksControl_ProgressBannerPosted(object sender, EventArgs e)
+        {
+            PlayBannerAddedVisualAnimation();
+        }
+
+        public async void PlayBannerAddedVisualAnimation()
+        {
+            StatusCenterPulseVisualPlayer.Visibility = Windows.UI.Xaml.Visibility.Visible;
+            await StatusCenterPulseVisualPlayer.PlayAsync(0, 1, false);
+            await StatusCenterPulseVisualPlayer.PlayAsync(0, 1, false);
+            StatusCenterPulseVisualPlayer.Visibility = Windows.UI.Xaml.Visibility.Collapsed;
         }
     }
 }

Files/UserControls/StatusCenter.xaml.cs

@@ -15,6 +15,7 @@ namespace Files.UserControls
     public sealed partial class StatusCenter : UserControl
     {
         public static ObservableCollection<StatusBanner> StatusBannersSource { get; set; } = new ObservableCollection<StatusBanner>();
+        public event EventHandler ProgressBannerPosted;
 
         public StatusCenter()
         {
@@ -35,6 +36,7 @@ public PostedStatusBanner PostBanner(string title, string message, uint initialP
         {
             var item = new StatusBanner(message, title, initialProgress, severity, operation);
             StatusBannersSource.Add(item);
+            ProgressBannerPosted?.Invoke(this, EventArgs.Empty);
             return new PostedStatusBanner(item);
         }