Skip to content

Commit 73adf9e

Browse files
committed
Snackbar animation according to the specs
1 parent 414d4c3 commit 73adf9e

File tree

1 file changed

+54
-54
lines changed

1 file changed

+54
-54
lines changed

MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.Snackbar.xaml

Lines changed: 54 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
22
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
33
xmlns:wpf="clr-namespace:MaterialDesignThemes.Wpf"
4-
xmlns:converters="clr-namespace:MaterialDesignThemes.Wpf.Converters">
4+
xmlns:converters="clr-namespace:MaterialDesignThemes.Wpf.Converters"
5+
xmlns:system="clr-namespace:System;assembly=mscorlib">
56

67
<ResourceDictionary.MergedDictionaries>
78
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Button.xaml" />
89
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
910
</ResourceDictionary.MergedDictionaries>
11+
12+
<converters:MathMultipleConverter x:Key="MathMlpMultipleConverter" Operation="Multiply" />
1013

1114
<Style TargetType="{x:Type wpf:Snackbar}">
1215
<Style.Resources>
@@ -19,77 +22,74 @@
1922
<VisualStateManager.VisualStateGroups>
2023
<VisualStateGroup x:Name="VisibilityStates">
2124
<VisualStateGroup.Transitions>
22-
<VisualTransition From="Hidden" To="Visible">
25+
<VisualTransition From="Hidden" To="Visible" GeneratedDuration="0">
26+
<VisualTransition.GeneratedEasingFunction>
27+
<CubicEase EasingMode="EaseOut"/>
28+
</VisualTransition.GeneratedEasingFunction>
2329
<Storyboard>
24-
<!-- an animation according to the specs will follow -->
25-
<!--<DoubleAnimationUsingKeyFrames Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY">
26-
<EasingDoubleKeyFrame Value="0" KeyTime="0" />
27-
<EasingDoubleKeyFrame Value="1" KeyTime="0:0:0.3">
28-
<EasingDoubleKeyFrame.EasingFunction>
29-
<SineEase EasingMode="EaseInOut" />
30-
</EasingDoubleKeyFrame.EasingFunction>
31-
</EasingDoubleKeyFrame>
32-
</DoubleAnimationUsingKeyFrames>-->
33-
<DoubleAnimation Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY" From="0" To="1" Duration="0:0:0.3" />
30+
<DoubleAnimation Storyboard.TargetName="PART_content" Storyboard.TargetProperty="Tag" To="1" Duration="0:0:0.3"/>
31+
<DoubleAnimation Storyboard.TargetName="PART_textBlock" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.3" />
3432
</Storyboard>
3533
</VisualTransition>
36-
<VisualTransition From="Visible" To="Hidden">
34+
<VisualTransition From="Visible" To="Hidden" GeneratedDuration="0">
35+
<VisualTransition.GeneratedEasingFunction>
36+
<CubicEase EasingMode="EaseOut"/>
37+
</VisualTransition.GeneratedEasingFunction>
3738
<Storyboard>
38-
<!-- an animation according to the specs will follow -->
39-
<!--<DoubleAnimationUsingKeyFrames Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY">
40-
<EasingDoubleKeyFrame Value="1" KeyTime="0" />
41-
<EasingDoubleKeyFrame Value="0" KeyTime="0:0:0.3">
42-
<EasingDoubleKeyFrame.EasingFunction>
43-
<SineEase EasingMode="EaseInOut" />
44-
</EasingDoubleKeyFrame.EasingFunction>
45-
</EasingDoubleKeyFrame>
46-
</DoubleAnimationUsingKeyFrames>-->
47-
<DoubleAnimation Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY" From="1" To="0" Duration="0:0:0.3" />
39+
<DoubleAnimation Storyboard.TargetName="PART_content" Storyboard.TargetProperty="Tag" To="0" Duration="0:0:0.3"/>
4840
</Storyboard>
4941
</VisualTransition>
5042
</VisualStateGroup.Transitions>
5143
<VisualState x:Name="Visible">
5244
<Storyboard>
53-
<DoubleAnimation Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY" To="1" Duration="0" />
45+
<DoubleAnimation Storyboard.TargetName="PART_content" Storyboard.TargetProperty="Tag" To="1" Duration="0"/>
5446
</Storyboard>
5547
</VisualState>
5648
<VisualState x:Name="Hidden">
5749
<Storyboard>
58-
<DoubleAnimation Storyboard.TargetName="SnackbarScaleTransform" Storyboard.TargetProperty="ScaleY" To="0" Duration="0" />
50+
<DoubleAnimation Storyboard.TargetName="PART_content" Storyboard.TargetProperty="Tag" To="0" Duration="0"/>
5951
</Storyboard>
6052
</VisualState>
6153
</VisualStateGroup>
6254
</VisualStateManager.VisualStateGroups>
6355
<Border x:Name="PART_border" Background="#FF323232" CornerRadius="2" MaxWidth="568" MinWidth="288">
64-
<Border.RenderTransform>
65-
<ScaleTransform x:Name="SnackbarScaleTransform" ScaleX="1" ScaleY="0" CenterY="0.5" />
66-
</Border.RenderTransform>
67-
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
68-
<Grid.ColumnDefinitions>
69-
<ColumnDefinition Width="100*" />
70-
<ColumnDefinition Width="auto" />
71-
</Grid.ColumnDefinitions>
72-
<TextBlock Text="{Binding Path=Message, RelativeSource={RelativeSource TemplatedParent}}">
73-
<TextBlock.Style>
74-
<Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource MaterialDesignBody1TextBlock}">
75-
<Setter Property="HorizontalAlignment" Value="Left" />
76-
<Setter Property="Margin" Value="24,14,24,14" />
77-
<Setter Property="FontSize" Value="14" />
78-
<Setter Property="Foreground" Value="#DDFFFFFF" />
79-
<Setter Property="TextWrapping" Value="WrapWithOverflow" />
80-
</Style>
81-
</TextBlock.Style>
82-
</TextBlock>
83-
<Button x:Name="PART_actionButton" Grid.Column="1" Content="{Binding Path=ActionLabel, RelativeSource={RelativeSource TemplatedParent}}">
84-
<Button.Style>
85-
<Style TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignFlatAccentButton}">
86-
<Setter Property="Margin" Value="8,0,8,0" />
87-
<Setter Property="VerticalAlignment" Value="Center" />
88-
<Setter Property="Visibility" Value="{Binding Path=ActionLabel, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource nullableToVisibilityConverter}}" />
89-
</Style>
90-
</Button.Style>
91-
</Button>
92-
</Grid>
56+
<StackPanel x:Name="PART_content" HorizontalAlignment="Stretch" Orientation="Vertical">
57+
<StackPanel.Tag>
58+
<system:Double>0.0</system:Double>
59+
</StackPanel.Tag>
60+
<StackPanel.Height>
61+
<MultiBinding Converter="{StaticResource MathMlpMultipleConverter}">
62+
<Binding ElementName="PART_content" Path="ActualHeight"/>
63+
<Binding RelativeSource="{RelativeSource Self}" Path="Tag"/>
64+
</MultiBinding>
65+
</StackPanel.Height>
66+
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
67+
<Grid.ColumnDefinitions>
68+
<ColumnDefinition Width="100*" />
69+
<ColumnDefinition Width="auto" />
70+
</Grid.ColumnDefinitions>
71+
<TextBlock x:Name="PART_textBlock" Text="{Binding Path=Message, RelativeSource={RelativeSource TemplatedParent}}">
72+
<TextBlock.Style>
73+
<Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource MaterialDesignBody1TextBlock}">
74+
<Setter Property="HorizontalAlignment" Value="Left" />
75+
<Setter Property="Margin" Value="24,14,24,14" />
76+
<Setter Property="FontSize" Value="14" />
77+
<Setter Property="Foreground" Value="#DDFFFFFF" />
78+
<Setter Property="TextWrapping" Value="WrapWithOverflow" />
79+
</Style>
80+
</TextBlock.Style>
81+
</TextBlock>
82+
<Button x:Name="PART_actionButton" Grid.Column="1" Content="{Binding Path=ActionLabel, RelativeSource={RelativeSource TemplatedParent}}">
83+
<Button.Style>
84+
<Style TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignFlatAccentButton}">
85+
<Setter Property="Margin" Value="8,0,8,0" />
86+
<Setter Property="VerticalAlignment" Value="Center" />
87+
<Setter Property="Visibility" Value="{Binding Path=ActionLabel, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource nullableToVisibilityConverter}}" />
88+
</Style>
89+
</Button.Style>
90+
</Button>
91+
</Grid>
92+
</StackPanel>
9393
</Border>
9494
</Grid>
9595
</ControlTemplate>

0 commit comments

Comments
 (0)