Skip to content

WIP MetroWindow: OverlayFadeIn / OverlayFadeOut #3162

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jan 20, 2018
Merged

WIP MetroWindow: OverlayFadeIn / OverlayFadeOut #3162

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b2ce173
MetroWindow: New OverlayFadeIn and OverlayFadeOut properties to set t…
punker76 Jan 18, 2018
267f01a
Fix the fade in and out animation if no duration exists
punker76 Jan 19, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
148 changes: 108 additions & 40 deletions src/MahApps.Metro/MahApps.Metro.Shared/Controls/MetroWindow.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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));

Expand Down Expand Up @@ -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>
Expand All @@ -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>
Expand All @@ -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>
Expand Down
34 changes: 17 additions & 17 deletions src/MahApps.Metro/MahApps.Metro/Themes/MetroWindow.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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" />
Expand Down Expand Up @@ -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" />
Expand All @@ -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}" />
Expand Down