Merge pull request #3162 from MahApps/feature/GH-2825_OverlayFadeIn_OverlayFadeOut_Storyboards

WIP MetroWindow: OverlayFadeIn / OverlayFadeOut

Author: punker76

src/MahApps.Metro/MahApps.Metro.Shared/Controls/MetroWindow.cs

@@ -108,6 +108,15 @@ public class MetroWindow : Window
         public static readonly DependencyProperty OverlayBrushProperty = DependencyProperty.Register("OverlayBrush", typeof(Brush), typeof(MetroWindow), new PropertyMetadata(new SolidColorBrush(Color.FromScRgb(255, 0, 0, 0)))); // BlackColorBrush
         public static readonly DependencyProperty OverlayOpacityProperty = DependencyProperty.Register("OverlayOpacity", typeof(double), typeof(MetroWindow), new PropertyMetadata(0.7d));
 
+        /// <summary>
+        /// Identifies the <see cref="OverlayFadeIn"/> dependency property.
+        /// </summary>
+        public static readonly DependencyProperty OverlayFadeInProperty = DependencyProperty.Register("OverlayFadeIn", typeof(Storyboard), typeof(MetroWindow), new PropertyMetadata(default(Storyboard)));
+        /// <summary>
+        /// Identifies the <see cref="OverlayFadeOut"/> dependency property.
+        /// </summary>
+        public static readonly DependencyProperty OverlayFadeOutProperty = DependencyProperty.Register("OverlayFadeOut", typeof(Storyboard), typeof(MetroWindow), new PropertyMetadata(default(Storyboard)));
+
         public static readonly DependencyProperty IconTemplateProperty = DependencyProperty.Register("IconTemplate", typeof(DataTemplate), typeof(MetroWindow), new PropertyMetadata(null));
         public static readonly DependencyProperty TitleTemplateProperty = DependencyProperty.Register("TitleTemplate", typeof(DataTemplate), typeof(MetroWindow), new PropertyMetadata(null));
 
@@ -756,12 +765,54 @@ public double OverlayOpacity
             set { SetValue(OverlayOpacityProperty, value); }
         }
 
+        /// <summary>
+        /// Gets or sets the overlay fade in storyboard.
+        /// </summary>
+        public Storyboard OverlayFadeIn
+        {
+            get { return (Storyboard)GetValue(OverlayFadeInProperty); }
+            set { SetValue(OverlayFadeInProperty, value); }
+        }
+
+        /// <summary>
+        /// Gets or sets the overlay fade out storyboard.
+        /// </summary>
+        public Storyboard OverlayFadeOut
+        {
+            get { return (Storyboard)GetValue(OverlayFadeOutProperty); }
+            set { SetValue(OverlayFadeOutProperty, value); }
+        }
+
         [Obsolete("This property will be deleted in the next release.")]
         public string WindowTitle
         {
             get { return TitleCaps ? Title.ToUpper() : Title; }
         }
 
+        private bool CanUseOverlayFadingStoryboard(Storyboard sb, out DoubleAnimation animation)
+        {
+            animation = null;
+            if (null == sb)
+            {
+                return false;
+            }
+
+            sb.Dispatcher.VerifyAccess();
+
+            animation = sb.Children.OfType<DoubleAnimation>().FirstOrDefault();
+            if (null == animation)
+            {
+                return false;
+            }
+
+            return (sb.Duration.HasTimeSpan && sb.Duration.TimeSpan.Ticks > 0)
+                   || (sb.AccelerationRatio > 0)
+                   || (sb.DecelerationRatio > 0)
+                   || (animation.Duration.HasTimeSpan && animation.Duration.TimeSpan.Ticks > 0)
+                   || animation.AccelerationRatio > 0
+                   || animation.DecelerationRatio > 0;
+        }
+
         /// <summary>
         /// Begins to show the MetroWindow's overlay effect.
         /// </summary>
@@ -781,32 +832,39 @@ public System.Threading.Tasks.Task ShowOverlayAsync()
 
             Dispatcher.VerifyAccess();
 
-            overlayBox.Visibility = Visibility.Visible;
-
-            var sb = ((Storyboard)this.Template.Resources["OverlayFastSemiFadeIn"]).Clone();
-            ((DoubleAnimation)sb.Children[0]).To = this.OverlayOpacity;
-
-            EventHandler completionHandler = null;
-            completionHandler = (sender, args) =>
+            var sb = OverlayFadeIn?.Clone();
+            overlayStoryboard = sb;
+            DoubleAnimation animation;
+            if (CanUseOverlayFadingStoryboard(sb, out animation))
             {
-                sb.Completed -= completionHandler;
+                this.overlayBox.SetCurrentValue(VisibilityProperty, Visibility.Visible);
 
-                if (overlayStoryboard == sb)
-                {
-                    overlayStoryboard = null;
-                }
+                animation.To = this.OverlayOpacity;
 
-                tcs.TrySetResult(null);
-            };
-
-            sb.Completed += completionHandler;
+                EventHandler completionHandler = null;
+                completionHandler = (sender, args) =>
+                    {
+                        sb.Completed -= completionHandler;
+                        if (overlayStoryboard == sb)
+                        {
+                            overlayStoryboard = null;
+                        }
 
-            overlayBox.BeginStoryboard(sb);
+                        tcs.TrySetResult(null);
+                    };
 
-            overlayStoryboard = sb;
+                sb.Completed += completionHandler;
+                overlayBox.BeginStoryboard(sb);
+            }
+            else
+            {
+                ShowOverlay();
+                tcs.TrySetResult(null);
+            }
 
             return tcs.Task;
         }
+
         /// <summary>
         /// Begins to hide the MetroWindow's overlay effect.
         /// </summary>
@@ -817,55 +875,65 @@ public System.Threading.Tasks.Task HideOverlayAsync()
 
             var tcs = new System.Threading.Tasks.TaskCompletionSource<object>();
 
-            if (overlayBox.Visibility == Visibility.Visible && overlayBox.Opacity == 0.0)
+            if (overlayBox.Visibility == Visibility.Visible && overlayBox.Opacity <= 0.0)
             {
                 //No Task.FromResult in .NET 4.
+                this.overlayBox.SetCurrentValue(VisibilityProperty, Visibility.Hidden);
                 tcs.SetResult(null);
                 return tcs.Task;
             }
 
             Dispatcher.VerifyAccess();
 
-            var sb = ((Storyboard)this.Template.Resources["OverlayFastSemiFadeOut"]).Clone();
-            ((DoubleAnimation)sb.Children[0]).To = 0d;
-
-            EventHandler completionHandler = null;
-            completionHandler = (sender, args) =>
+            var sb = OverlayFadeOut?.Clone();
+            overlayStoryboard = sb;
+            DoubleAnimation animation;
+            if (CanUseOverlayFadingStoryboard(sb, out animation))
             {
-                sb.Completed -= completionHandler;
-
-                if (overlayStoryboard == sb)
-                {
-                    overlayBox.Visibility = Visibility.Hidden;
-                    overlayStoryboard = null;
-                }
+                animation.To = 0d;
 
-                tcs.TrySetResult(null);
-            };
-
-            sb.Completed += completionHandler;
+                EventHandler completionHandler = null;
+                completionHandler = (sender, args) =>
+                    {
+                        sb.Completed -= completionHandler;
+                        if (overlayStoryboard == sb)
+                        {
+                            this.overlayBox.SetCurrentValue(VisibilityProperty, Visibility.Hidden);
+                            overlayStoryboard = null;
+                        }
 
-            overlayBox.BeginStoryboard(sb);
+                        tcs.TrySetResult(null);
+                    };
 
-            overlayStoryboard = sb;
+                sb.Completed += completionHandler;
+                overlayBox.BeginStoryboard(sb);
+            }
+            else
+            {
+                HideOverlay();
+                tcs.TrySetResult(null);
+            }
 
             return tcs.Task;
         }
+
         public bool IsOverlayVisible()
         {
             if (overlayBox == null) throw new InvalidOperationException("OverlayBox can not be founded in this MetroWindow's template. Are you calling this before the window has loaded?");
 
             return overlayBox.Visibility == Visibility.Visible && overlayBox.Opacity >= this.OverlayOpacity;
         }
+
         public void ShowOverlay()
         {
-            overlayBox.Visibility = Visibility.Visible;
+            this.overlayBox.SetCurrentValue(VisibilityProperty, Visibility.Visible);
             overlayBox.SetCurrentValue(Grid.OpacityProperty, this.OverlayOpacity);
         }
+
         public void HideOverlay()
         {
-            overlayBox.SetCurrentValue(Grid.OpacityProperty, 0.0);
-            overlayBox.Visibility = System.Windows.Visibility.Hidden;
+            overlayBox.SetCurrentValue(Grid.OpacityProperty, 0d);
+            this.overlayBox.SetCurrentValue(VisibilityProperty, Visibility.Hidden);
         }
 
         /// <summary>

src/MahApps.Metro/MahApps.Metro/Themes/MetroWindow.xaml

@@ -211,23 +211,6 @@
                         Visibility="Collapsed" />
         </Grid>
 
-        <ControlTemplate.Resources>
-            <Storyboard x:Key="OverlayFastSemiFadeIn"
-                        AccelerationRatio=".97"
-                        BeginTime="0:0:0"
-                        SpeedRatio="2.7"
-                        Storyboard.TargetProperty="Opacity">
-                <DoubleAnimation To=".7" />
-            </Storyboard>
-            <Storyboard x:Key="OverlayFastSemiFadeOut"
-                        AccelerationRatio=".97"
-                        BeginTime="0:0:0"
-                        SpeedRatio="2.7"
-                        Storyboard.TargetProperty="Opacity">
-                <DoubleAnimation To="0.0" />
-            </Storyboard>
-        </ControlTemplate.Resources>
-
         <ControlTemplate.Triggers>
             <Trigger Property="ShowDialogsOverTitleBar" Value="False">
                 <Setter TargetName="PART_MetroActiveDialogContainer" Property="Grid.Row" Value="1" />
@@ -553,6 +536,21 @@
 
     </ControlTemplate>
 
+    <Storyboard x:Key="OverlayFastSemiFadeIn"
+                AccelerationRatio=".97"
+                BeginTime="0:0:0"
+                SpeedRatio="2.7"
+                Storyboard.TargetProperty="Opacity">
+        <DoubleAnimation To=".7" />
+    </Storyboard>
+    <Storyboard x:Key="OverlayFastSemiFadeOut"
+                AccelerationRatio=".97"
+                BeginTime="0:0:0"
+                SpeedRatio="2.7"
+                Storyboard.TargetProperty="Opacity">
+        <DoubleAnimation To="0.0" />
+    </Storyboard>
+
     <Style TargetType="{x:Type Controls:MetroWindow}">
         <Setter Property="Background" Value="{DynamicResource WhiteBrush}" />
         <Setter Property="BorderBrush" Value="Transparent" />
@@ -561,6 +559,8 @@
         <Setter Property="NonActiveBorderBrush" Value="{DynamicResource NonActiveBorderColorBrush}" />
         <Setter Property="NonActiveWindowTitleBrush" Value="{DynamicResource NonActiveWindowTitleColorBrush}" />
         <Setter Property="OverlayBrush" Value="{DynamicResource BlackColorBrush}" />
+        <Setter Property="OverlayFadeIn" Value="{StaticResource OverlayFastSemiFadeIn}" />
+        <Setter Property="OverlayFadeOut" Value="{StaticResource OverlayFastSemiFadeOut}" />
         <Setter Property="Template" Value="{StaticResource WindowTemplateKey}" />
         <Setter Property="TextElement.FontSize" Value="{DynamicResource ContentFontSize}" />
         <Setter Property="TitleForeground" Value="{DynamicResource IdealForegroundColorBrush}" />