Question

所以我有这种风格：

<Style x:Key="AnimatedSwitch" TargetType="{x:Type ToggleButton}">
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="Background" Value="Crimson" />
            <Setter Property="BorderBrush" Value="#EAEAEB" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Viewbox Stretch="Uniform">
                            <Canvas Name="Layer_1" Width="20" Height="20" Canvas.Left="10" Canvas.Top="0">
                                <Ellipse  Canvas.Left="0" Width="20" Height="20" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="0.5"/>
                                <Ellipse  Canvas.Left="15" Width="20" Height="20" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="0.5"/>
                                <Border Canvas.Left="10" Width="15" Height="20" Name="rect416927" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,0.5,0,0.5"/>
                                <Ellipse x:Name="ellipse"  Canvas.Left="0" Width="20" Height="20" Fill="White" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="0.3">
                                    <Ellipse.RenderTransform>
                                        <TranslateTransform X="0" Y="0" />
                                    </Ellipse.RenderTransform>
                                    <Ellipse.BitmapEffect>
                                        <DropShadowBitmapEffect Softness="0.1" ShadowDepth="0.7" Direction="270" Color="#BBBBBB"/>
                                    </Ellipse.BitmapEffect>
                                </Ellipse>
                            </Canvas>
                        </Viewbox>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="True" >
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetProperty="Background.Color" To="LightSeaGreen" Duration="0:0:0.2" />
                                            <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="LightSeaGreen" Duration="0:0:0.2" />
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                                                <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
                                                <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
                                            <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FAFAFB" Duration="0:0:0.2" />
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                                                <SplineDoubleKeyFrame KeyTime="0" Value="15"/>
                                                <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>

                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

我在IsChecked = True（颜色LightSeaGreen）时更改了颜色，并且我将IsChecked = False重复为Red颜色：

<Trigger Property="IsChecked" Value="False" >
    <Trigger.EnterActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="Red" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="Red" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </Trigger.EnterActions>
    <Trigger.ExitActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FAFAFB" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="15"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </Trigger.ExitActions>
</Trigger>

所以我的问题是，在我的ToggleButton checked后，它变为Red而不是LightSeaGreen，当取消选中时，它变为White而不是{{} 1}}。只有在添加此Red

之后才能进行此操作

Answer 1

您的问题是以下几行：

<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FAFAFB" Duration="0:0:0.2" />

您必须再次在ExitActions中设置To到Crimson并且它应该正常工作

将自定义颜色添加到ToggleButton IsChecked = false

1 个答案: