Skip to content

Commit ce6b70e

Browse files
ButchersBoyButchersBoy
committed
improve transitions MaterialDesignSwitchToggleButton #73 
1 parent dfce5ae commit ce6b70e

File tree

1 file changed

+47
-32
lines changed

1 file changed

+47
-32
lines changed

‎MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.ToggleButton.xaml

Lines changed: 47 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -276,19 +276,8 @@
276276
<Setter Property="Template">
277277
<Setter.Value>
278278
<ControlTemplate TargetType="{x:Type ToggleButton}">
279-
<ControlTemplate.Resources>
280-
<SineEase x:Key="RippleEasingFunction" EasingMode="EaseInOut"/>
281-
282-
<Storyboard x:Key="Checked">
283-
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder">
284-
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
285-
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="23.5">
286-
<EasingDoubleKeyFrame.EasingFunction>
287-
<QuadraticEase EasingMode="EaseOut"/>
288-
</EasingDoubleKeyFrame.EasingFunction>
289-
</EasingDoubleKeyFrame>
290-
</DoubleAnimationUsingKeyFrames>
291-
</Storyboard>
279+
<ControlTemplate.Resources>
280+
<SineEase x:Key="RippleEasingFunction" EasingMode="EaseInOut"/>
292281
<Storyboard x:Key="ShowRipple">
293282
<DoubleAnimation Storyboard.TargetName="RippleThumb" Storyboard.TargetProperty="Opacity"
294283
EasingFunction="{StaticResource RippleEasingFunction}"
@@ -305,19 +294,51 @@
305294
EasingFunction="{StaticResource RippleEasingFunction}"
306295
To="0" Duration="0:0:0.3"/>
307296
</Storyboard>
308-
<Storyboard x:Key="Unchecked">
309-
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder">
310-
<EasingDoubleKeyFrame KeyTime="0" Value="23.5"/>
311-
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0">
312-
<EasingDoubleKeyFrame.EasingFunction>
313-
<QuadraticEase EasingMode="EaseOut"/>
314-
</EasingDoubleKeyFrame.EasingFunction>
315-
</EasingDoubleKeyFrame>
316-
</DoubleAnimationUsingKeyFrames>
317-
</Storyboard>
318-
</ControlTemplate.Resources>
319-
<Viewbox Width="34">
320-
<Grid>
297+
</ControlTemplate.Resources>
298+
<Viewbox Width="34">
299+
<VisualStateManager.VisualStateGroups>
300+
<VisualStateGroup x:Name="CheckStates">
301+
<VisualStateGroup.Transitions>
302+
<VisualTransition From="*" To="Checked">
303+
<Storyboard>
304+
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder">
305+
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
306+
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="23.5">
307+
<EasingDoubleKeyFrame.EasingFunction>
308+
<QuadraticEase EasingMode="EaseOut"/>
309+
</EasingDoubleKeyFrame.EasingFunction>
310+
</EasingDoubleKeyFrame>
311+
</DoubleAnimationUsingKeyFrames>
312+
</Storyboard>
313+
</VisualTransition>
314+
<VisualTransition From="Checked" To="Unchecked">
315+
<Storyboard>
316+
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder">
317+
<EasingDoubleKeyFrame KeyTime="0" Value="23.5"/>
318+
<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0">
319+
<EasingDoubleKeyFrame.EasingFunction>
320+
<QuadraticEase EasingMode="EaseOut"/>
321+
</EasingDoubleKeyFrame.EasingFunction>
322+
</EasingDoubleKeyFrame>
323+
</DoubleAnimationUsingKeyFrames>
324+
</Storyboard>
325+
</VisualTransition>
326+
</VisualStateGroup.Transitions>
327+
<VisualState x:Name="Checked">
328+
<Storyboard>
329+
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder"
330+
Duration="0" To="23.5" />
331+
</Storyboard>
332+
</VisualState>
333+
<VisualState x:Name="Unchecked">
334+
<Storyboard>
335+
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ThumbHolder"
336+
Duration="0" To="0" />
337+
</Storyboard>
338+
</VisualState>
339+
</VisualStateGroup>
340+
</VisualStateManager.VisualStateGroups>
341+
<Grid>
321342
<Rectangle x:Name="Track"
322343
Fill="Black" HorizontalAlignment="Left" Height="15" Margin="4.211,5,4.211,0" Stroke="{x:Null}" VerticalAlignment="Top" Width="40" RadiusY="7.5" RadiusX="7.5" Opacity="0.26"/>
323344

@@ -351,12 +372,6 @@
351372
<Trigger Property="IsChecked" Value="True">
352373
<Setter TargetName="Thumb" Property="Fill" Value="{DynamicResource PrimaryHueMidBrush}" />
353374
<Setter TargetName="Track" Property="Fill" Value="{DynamicResource PrimaryHueLightBrush}" />
354-
<Trigger.EnterActions>
355-
<BeginStoryboard Storyboard="{StaticResource Checked}"/>
356-
</Trigger.EnterActions>
357-
<Trigger.ExitActions>
358-
<BeginStoryboard Storyboard="{StaticResource Unchecked}"/>
359-
</Trigger.ExitActions>
360375
</Trigger>
361376
<Trigger Property="Button.IsDefaulted" Value="true"/>
362377
<Trigger Property="IsMouseOver" Value="true"/>

0 commit comments

Comments
 (0)