tsai
/
Avalonia
mirror of https://github.com/AvaloniaUI/Avalonia.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

add nice animations with animated stacking.

pull/2453/head
Dan Walmsley 7 years ago
parent
8283f3bca7
commit
73e5472a5d
2 changed files with 27 additions and 23 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/Avalonia.Controls/Notifications/Notification.cs
  2. 48
      src/Avalonia.Themes.Default/NotificationArea.xaml

2
src/Avalonia.Controls/Notifications/Notification.cs
View File

@ -9,7 +9,7 @@ namespace Avalonia.Controls.Notifications
{ {
public class Notification : ContentControl public class Notification : ContentControl
{ {
private TimeSpan _closingAnimationTime = TimeSpan.FromSeconds(0.25); private TimeSpan _closingAnimationTime = TimeSpan.FromSeconds(1);
static Notification() static Notification()
{ {

48
src/Avalonia.Themes.Default/NotificationArea.xaml
View File

@ -13,8 +13,8 @@
<Setter Property="Width" Value="350"/> <Setter Property="Width" Value="350"/>
<Setter Property="FontSize" Value="14"/> <Setter Property="FontSize" Value="14"/>
<Setter Property="Foreground" Value="White"/> <Setter Property="Foreground" Value="White"/>
<!-- <Setter Property="ContentTemplateSelector" Value="{StaticResource NotificationTemplateSelector}"/> --> <!-- <Setter Property="ContentTemplateSelector" Value="{StaticResource NotificationTemplateSelector}"/> -->
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border Background="{TemplateBinding Background}" <Border Background="{TemplateBinding Background}"
@ -30,31 +30,35 @@
</Setter> </Setter>
<Style.Animations> <Style.Animations>
<Animation Duration="0:0:0.200" Easing="CubicEaseInOut"> <Animation Duration="0:0:1.0" Easing="CubicEaseInOut" FillMode="Forward">
<KeyFrame Cue="0%"> <KeyFrame Cue="0%">
<Setter Property="Opacity" Value="0"/> <Setter Property="Opacity" Value="0"/>
<Setter Property="TranslateTransform.X" Value="250"/> <Setter Property="TranslateTransform.X" Value="250"/>
</KeyFrame> <Setter Property="Height" Value="0"/>
<KeyFrame Cue="100%"> </KeyFrame>
<Setter Property="Opacity" Value="1"/> <KeyFrame Cue="100%">
<Setter Property="TranslateTransform.X" Value="0"/> <Setter Property="Opacity" Value="1"/>
</KeyFrame> <Setter Property="TranslateTransform.X" Value="0"/>
</Animation> <Setter Property="Height" Value="100"/>
</KeyFrame>
</Animation>
</Style.Animations> </Style.Animations>
</Style> </Style>
<Style Selector="Notification[IsClosing=true]"> <Style Selector="Notification[IsClosing=true]">
<Style.Animations> <Style.Animations>
<Animation Duration="0:0:0.150" Easing="CubicEaseInOut" FillMode="Forward"> <Animation Duration="0:0:1.0" Easing="CubicEaseInOut" FillMode="Forward">
<KeyFrame Cue="0%"> <KeyFrame Cue="0%">
<Setter Property="Opacity" Value="1"/> <Setter Property="Height" Value="100"/>
<Setter Property="TranslateTransform.X" Value="0"/> <Setter Property="Opacity" Value="1"/>
</KeyFrame> <Setter Property="TranslateTransform.X" Value="0"/>
<KeyFrame Cue="100%"> </KeyFrame>
<Setter Property="Opacity" Value="0"/> <KeyFrame Cue="100%">
<Setter Property="TranslateTransform.X" Value="250"/> <Setter Property="Height" Value="0"/>
</KeyFrame> <Setter Property="Opacity" Value="0"/>
</Animation> <Setter Property="TranslateTransform.X" Value="250"/>
</KeyFrame>
</Animation>
</Style.Animations> </Style.Animations>
</Style> </Style>

Write Preview
Loading…
Cancel
Save