- Adjust Animation / Formatting

Flow.Launcher/MainWindow.xaml.cs

@@ -30,6 +30,10 @@ using System.Windows.Data;
 using ModernWpf.Controls;
 using System.Drawing;
 using System.Windows.Forms.Design.Behavior;
+using System.Security.Cryptography;
+using System.Runtime.CompilerServices;
+using Microsoft.VisualBasic.Devices;
+using Microsoft.FSharp.Data.UnitSystems.SI.UnitNames;
 
 namespace Flow.Launcher
 {
@@ -105,7 +109,6 @@ namespace Flow.Launcher
             // since the default main window visibility is visible
             // so we need set focus during startup
             QueryTextBox.Focus();
-
             _viewModel.PropertyChanged += (o, e) =>
             {
                 switch (e.PropertyName)
@@ -243,7 +246,9 @@ namespace Flow.Launcher
                 Icon = Properties.Resources.app,
                 Visible = !_settings.HideNotifyIcon
             };
+
             contextMenu = new ContextMenu();
+
             var openIcon = new FontIcon { Glyph = "\ue71e" };
             var open = new MenuItem
             {
@@ -280,9 +285,11 @@ namespace Flow.Launcher
             positionreset.Click += (o, e) => PositionReset();
             settings.Click += (o, e) => App.API.OpenSettingDialog();
             exit.Click += (o, e) => Close();
-            contextMenu.Items.Add(open);
+
             gamemode.ToolTip = InternationalizationManager.Instance.GetTranslation("GameModeToolTip");
             positionreset.ToolTip = InternationalizationManager.Instance.GetTranslation("PositionResetToolTip");
+
+            contextMenu.Items.Add(open);
             contextMenu.Items.Add(gamemode);
             contextMenu.Items.Add(positionreset);
             contextMenu.Items.Add(settings);
@@ -359,11 +366,14 @@ namespace Flow.Launcher
 
             _animating = true;
             UpdatePosition();
-            Storyboard sb = new Storyboard();
+
+            Storyboard windowsb = new Storyboard();
+            Storyboard clocksb = new Storyboard();
             Storyboard iconsb = new Storyboard();
-            CircleEase easing = new CircleEase();  // or whatever easing class you want
+            CircleEase easing = new CircleEase();
             easing.EasingMode = EasingMode.EaseInOut;
-            var da = new DoubleAnimation
+
+            var WindowOpacity = new DoubleAnimation
             {
                 From = 0,
                 To = 1,
@@ -371,33 +381,76 @@ namespace Flow.Launcher
                 FillBehavior = FillBehavior.Stop
             };
 
-            var da2 = new DoubleAnimation
+            var WindowMotion = new DoubleAnimation
             {
                 From = Top + 10,
                 To = Top,
                 Duration = TimeSpan.FromSeconds(0.25),
                 FillBehavior = FillBehavior.Stop
             };
-                var da3 = new DoubleAnimation
+            var IconMotion = new DoubleAnimation
-                {
+            {
                     From = 12,
                     To = 0,
                     EasingFunction = easing,
                     Duration = TimeSpan.FromSeconds(0.36),
                     FillBehavior = FillBehavior.Stop
-                };
+            };
-            Storyboard.SetTarget(da, this);
+
-            Storyboard.SetTargetProperty(da, new PropertyPath(Window.OpacityProperty));
+            var ClockOpacity = new DoubleAnimation
-            Storyboard.SetTargetProperty(da2, new PropertyPath(Window.TopProperty));
+            {
-            Storyboard.SetTargetProperty(da3, new PropertyPath(TopProperty));
+                From = 0,
-            sb.Children.Add(da);
+                To = 1,
-            sb.Children.Add(da2);
+                EasingFunction = easing,
-            iconsb.Children.Add(da3);
+                Duration = TimeSpan.FromSeconds(0.36),
-            sb.Completed += (_, _) => _animating = false;
+                FillBehavior = FillBehavior.Stop
+            };
+            double TargetIconOpacity = SearchIcon.Opacity; // Animation Target Opacity from Style
+            var IconOpacity = new DoubleAnimation
+            {
+                From = 0,
+                To = TargetIconOpacity,
+                EasingFunction = easing,
+                Duration = TimeSpan.FromSeconds(0.36),
+                FillBehavior = FillBehavior.Stop
+            };
+
+            double right = ClockPanel.Margin.Right;
+            var thicknessAnimation = new ThicknessAnimation
+            {
+                From = new Thickness(0, 12, right, 0),
+                To = new Thickness(0, 0, right, 0),
+                EasingFunction = easing,
+                Duration = TimeSpan.FromSeconds(0.36),
+                FillBehavior = FillBehavior.Stop
+            };
+
+            Storyboard.SetTargetProperty(ClockOpacity, new PropertyPath(OpacityProperty));
+            Storyboard.SetTargetName(thicknessAnimation, "ClockPanel");
+            Storyboard.SetTargetProperty(thicknessAnimation, new PropertyPath(MarginProperty));
+            Storyboard.SetTarget(WindowOpacity, this);
+            Storyboard.SetTargetProperty(WindowOpacity, new PropertyPath(Window.OpacityProperty));
+            Storyboard.SetTargetProperty(WindowMotion, new PropertyPath(Window.TopProperty));
+            Storyboard.SetTargetProperty(IconMotion, new PropertyPath(TopProperty));
+            Storyboard.SetTargetProperty(IconOpacity, new PropertyPath(OpacityProperty));
+
+            clocksb.Children.Add(thicknessAnimation);
+            clocksb.Children.Add(ClockOpacity);
+            windowsb.Children.Add(WindowOpacity);
+            windowsb.Children.Add(WindowMotion);
+            iconsb.Children.Add(IconMotion);
+            iconsb.Children.Add(IconOpacity);
+
+            windowsb.Completed += (_, _) => _animating = false;
             _settings.WindowLeft = Left;
             _settings.WindowTop = Top;
+
+            if (QueryTextBox.Text.Length == 0)
+            {
+                clocksb.Begin(ClockPanel);
+            }
             iconsb.Begin(SearchIcon);
-            sb.Begin(FlowMainWindow);
+            windowsb.Begin(FlowMainWindow);
         }
 
         private void OnMouseDown(object sender, MouseButtonEventArgs e)

Flow.Launcher/Themes/Base.xaml

@@ -79,18 +79,18 @@
         <Setter Property="Stroke" Value="Blue" />
     </Style>
 
-    <Style x:Key="BaseClockPosition" TargetType="{x:Type Canvas}" />
+    <Style x:Key="BaseClockPanelPosition" TargetType="{x:Type Canvas}" />
 
     <Style x:Key="BaseClockPanel" TargetType="{x:Type StackPanel}">
         <Setter Property="Orientation" Value="Horizontal" />
         <Setter Property="HorizontalAlignment" Value="Right" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="Height" Value="Auto" />
-        <Setter Property="Margin" Value="0,0,14,0" />
+        <Setter Property="Margin" Value="0,0,66,0" />
         <Setter Property="Visibility" Value="Collapsed" />
     </Style>
     <Style x:Key="BaseClockBox" TargetType="{x:Type TextBlock}">
-        <Setter Property="FontSize" Value="18" />
+        <Setter Property="FontSize" Value="20" />
         <Setter Property="Foreground" Value="#8f8f8f" />
         <Setter Property="HorizontalAlignment" Value="Right" />
         <Setter Property="VerticalAlignment" Value="Center" />
@@ -131,8 +131,7 @@
         BasedOn="{StaticResource BaseClockPanel}"
         TargetType="{x:Type StackPanel}">
         <Setter Property="Orientation" Value="Vertical" />
-        <Setter Property="Margin" Value="0,0,66,0" />
+        <Setter Property="Visibility" Value="Collapsed" />
-        <Setter Property="Visibility" Value="Visible" />
         <Style.Triggers>
             <MultiDataTrigger>
                 <MultiDataTrigger.Conditions>
@@ -140,30 +139,19 @@
                     <Condition Binding="{Binding ElementName=ContextMenu, Path=Visibility}" Value="Collapsed" />
                     <Condition Binding="{Binding ElementName=History, Path=Visibility}" Value="Collapsed" />
                 </MultiDataTrigger.Conditions>
+                <Setter Property="Visibility" Value="Visible" />
                 <MultiDataTrigger.EnterActions>
                     <BeginStoryboard>
                         <Storyboard>
                             <DoubleAnimation
                                 Storyboard.TargetProperty="Opacity"
                                 From="0.0"
-                                To="1.0"
+                                To="1"
-                                Duration="0:0:0.2" />
+                                Duration="0:0:0.25" />
                         </Storyboard>
                     </BeginStoryboard>
                 </MultiDataTrigger.EnterActions>
-                <MultiDataTrigger.ExitActions>
-                    <BeginStoryboard>
-                        <Storyboard>
-                            <DoubleAnimation
-                                Storyboard.TargetProperty="Opacity"
-                                To="0.0"
-                                Duration="0:0:0.2" />
-                        </Storyboard>
-                    </BeginStoryboard>
-                </MultiDataTrigger.ExitActions>
-
             </MultiDataTrigger>
-
         </Style.Triggers>
 
     </Style>
@@ -379,6 +367,12 @@
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="HorizontalAlignment" Value="Right" />
     </Style>
+    <Style
+        x:Key="ClockPanelPosition"
+        BasedOn="{StaticResource BaseClockPanelPosition}"
+        TargetType="{x:Type Canvas}">
+        <Setter Property="Margin" Value="0,2,66,0" />
+    </Style>
     <Style
         x:Key="ItemHotkeyStyle"
         BasedOn="{StaticResource BaseItemHotkeyStyle}"

Flow.Launcher/Themes/Win11Light.xaml

@@ -169,6 +169,7 @@
         BasedOn="{StaticResource BaseClockBox}"
         TargetType="{x:Type TextBlock}">
         <Setter Property="Foreground" Value="#acacac" />
+        <Setter Property="FontSize" Value="22" />
     </Style>
     <Style
         x:Key="DateBox"