为什么情节提要动画只能在 WPF Blend 中与我的 SlideButton (CheckBox) 部分配合使用？

问题描述

所以我从 CheckBox 模板创建了一个 SlideButton，然后为每个切换一个 StoryBoard 动画。但是，选中复选框时它会自动进行更改。对于右边的toogle，我可以通过注释掉这部分来修复它：

<Trigger Property="IsChecked" Value="true">
                            <Trigger.Exitactions>
                                <BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard3}"/>
                            </Trigger.Exitactions>
                            <Trigger.Enteractions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
                            </Trigger.Enteractions>
                            <Setter Property="Opacity" TargetName="optionMark" Value="1"/>
                            <Setter Property="Opacity" TargetName="indeterminateMark" Value="0"/>
                            <Setter Property="Background" TargetName="Border" Value="#43B581"/>
                            <!--<Setter Property="Margin" TargetName="checkBoxBorder" Value="57.733,4.874,0"/>-->
                        </Trigger>

但是，如果我想返回，即如果复选框设置为 False，我找不到只有我的故事板动画有效的方法。

我的完整代码：

<Window x:Class="ButtonNew.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:ButtonNew"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Window.Resources>
    <Style x:Key="FocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle Margin="2" SnapsToDevicePixels="true" stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" strokeThickness="1" strokeDashArray="1 2"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="OptionMark.Static.Background" Color="#FFFFFFFF"/>
    <SolidColorBrush x:Key="OptionMark.Static.Border" Color="#FF707070"/>
    <Style x:Key="OptionMarkFocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle Margin="14,0" SnapsToDevicePixels="true" stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" strokeThickness="1" strokeDashArray="1 2"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="OptionMark.MouSEOver.Background" Color="#FFF3F9FF"/>
    <SolidColorBrush x:Key="OptionMark.MouSEOver.Border" Color="#FF5593FF"/>
    <SolidColorBrush x:Key="OptionMark.MouSEOver.Glyph" Color="#FF212121"/>
    <SolidColorBrush x:Key="OptionMark.disabled.Background" Color="#FFE6E6E6"/>
    <SolidColorBrush x:Key="OptionMark.disabled.Border" Color="#FFBCBCBC"/>
    <SolidColorBrush x:Key="OptionMark.disabled.Glyph" Color="#FF707070"/>
    <SolidColorBrush x:Key="OptionMark.pressed.Background" Color="#FFD9ECFF"/>
    <SolidColorBrush x:Key="OptionMark.pressed.Border" Color="#FF3C77DD"/>
    <SolidColorBrush x:Key="OptionMark.pressed.Glyph" Color="#FF212121"/>
    <SolidColorBrush x:Key="OptionMark.Static.Glyph" Color="#FF212121"/>
    <Style x:Key="CheckBoxStyle1" targettype="{x:Type CheckBox}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
        <Setter Property="Background" Value="{StaticResource OptionMark.Static.Background}"/>
        <Setter Property="BorderBrush" Value="{StaticResource OptionMark.Static.Border}"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate targettype="{x:Type CheckBox}">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="Storyboard1">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.771"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="0.975"/>
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="18.333"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="53.25"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="Storyboard2">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0.975"/>
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="-52.749"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                        <Storyboard x:Key="Storyboard3">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.704"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="0.968"/>
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="checkBoxBorder">
                                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="-16.75"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="-49.75"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </ControlTemplate.Resources>
                    <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="25" BorderThickness="0" Margin="0,78.001,0" Background="#FF878787">
                        <Grid x:Name="templateRoot" Background="{x:Null}" SnapsToDevicePixels="True" Margin="-0.729,-0.854,0">
                            <Grid.ColumnDeFinitions>
                                <ColumnDeFinition Width="Auto"/>
                                <ColumnDeFinition Width="*"/>
                            </Grid.ColumnDeFinitions>
                            <Border x:Name="checkBoxBorder" CornerRadius="25" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0" Background="White" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="3.959,0" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Height="44.572" Width="47.557" Grid.ColumnSpan="2" RenderTransformOrigin="0.5,0.5">
                                <Border.RenderTransform>
                                    <TransformGroup>
                                        <ScaleTransform/>
                                        <SkewTransform/>
                                        <RotateTransform/>
                                        <TranslateTransform/>
                                    </TransformGroup>
                                </Border.RenderTransform>
                                <Grid x:Name="markGrid" >
                                    <Path x:Name="optionMark" Fill="{StaticResource OptionMark.Static.Glyph}" Margin="1" Opacity="0" Stretch="None"/>
                                    <Rectangle x:Name="indeterminateMark" Fill="#FF0C0C0C" Margin="14.065,13.25,2,2" Opacity="0" stroke="{x:Null}"/>
                                </Grid>
                            </Border>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="HasContent" Value="true">
                            <Setter Property="FocusVisualStyle" Value="{StaticResource OptionMarkFocusVisual}"/>
                            <Setter Property="Padding" Value="4,-1,0"/>
                        </Trigger>
                        <Trigger Property="IsMouSEOver" Value="true">
                            <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouSEOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouSEOver.Border}"/>
                            <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.MouSEOver.Glyph}"/>
                            <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.MouSEOver.Glyph}"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.disabled.Border}"/>
                            <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.disabled.Glyph}"/>
                            <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.disabled.Glyph}"/>
                        </Trigger>
                        <Trigger Property="Ispressed" Value="true">
                            <Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.pressed.Background}"/>
                            <Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.pressed.Border}"/>
                            <Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.pressed.Glyph}"/>
                            <Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.pressed.Glyph}"/>
                        </Trigger>
                        <Trigger Property="IsChecked" Value="true">
                            <Trigger.Exitactions>
                                <BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard3}"/>
                            </Trigger.Exitactions>
                            <Trigger.Enteractions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
                            </Trigger.Enteractions>
                            <Setter Property="Opacity" TargetName="optionMark" Value="1"/>
                            <Setter Property="Opacity" TargetName="indeterminateMark" Value="0"/>
                            <Setter Property="Background" TargetName="Border" Value="#43B581"/>
                            <!--<Setter Property="Margin" TargetName="checkBoxBorder" Value="57.733,0"/>-->
                        </Trigger>
                        <Trigger Property="IsChecked" Value="{x:Null}">
                            <Setter Property="Opacity" TargetName="optionMark" Value="0"/>
                            <Setter Property="Opacity" TargetName="indeterminateMark" Value="1"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <CheckBox Content="CheckBox" HorizontalAlignment="Left" Height="53" Margin="219,155,0" VerticalAlignment="Top" Width="185" Style="{DynamicResource CheckBoxStyle1}"/>
</Grid>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）