Question

我正在尝试在Silverlight上的ToggleButton上设置VisualStates的样式。一切正常，除了Checked状态不遵守Rectangle.Fill中的更改，但文本颜色更改工作正常，因此Checked正在被触发。

我希望Checked具有与Pressed相同的VisualState，并且Pressed工作正常，但是当ToggleButton被按下并且状态是Checked时，Rectangle.Fill恢复到开始状态而不是我为Checked定义的状态州。非常感谢任何帮助。

<UserControl.Resources>
        <Style x:Key="ToggleButtonStyle" TargetType="ToggleButton">
            <Setter Property="Background" Value="#FF1F3B53"/>
            <Setter Property="Foreground" Value="#FF000000"/>
            <Setter Property="Padding" Value="3"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="BorderBrush">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FFA3AEB9" Offset="0"/>
                        <GradientStop Color="#FF8399A9" Offset="0.375"/>
                        <GradientStop Color="#FF718597" Offset="0.375"/>
                        <GradientStop Color="#FF617584" Offset="1"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#E3E9F1" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#E3E9F1" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#C2C7D0" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#A8B0BB" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FFD6DCE6" Storyboard.TargetProperty="Color" Storyboard.TargetName="scb"/>
                                            <ColorAnimation Duration="0" To="#FF0C6297" Storyboard.TargetProperty="Color" Storyboard.TargetName="dse"/>
                                            <ColorAnimation Duration="0" To="#0F72B0" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#127DC5" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#249CD5" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#2AAEEA" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled" />
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FFD6DCE6" Storyboard.TargetProperty="Color" Storyboard.TargetName="scb"/>
                                            <ColorAnimation Duration="0" To="#FF0C6297" Storyboard.TargetProperty="Color" Storyboard.TargetName="dse"/>
                                            <ColorAnimation Duration="0" To="#0F72B0" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#127DC5" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#249CD5" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                            <ColorAnimation Duration="0" To="#2AAEEA" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="ThemesButton"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                    <VisualState x:Name="Unfocused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>

                            <Rectangle x:Name="ThemesButton" Height="40" Stroke="#80858C" StrokeThickness="0.75" UseLayoutRounding="False" Width="174">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                        <GradientStop Color="#E3E9F1" Offset="0"/>
                                        <GradientStop Color="#C2C7D0" Offset="0.09"/>
                                        <GradientStop Color="#A8B0BB" Offset="0.75"/>
                                        <GradientStop Color="#ABB2BC" Offset="1"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>

                            <TextBlock x:Name="ButtonText" TextWrapping="Wrap" Text="{TemplateBinding Content}" FontFamily="Calibri" FontSize="18.5" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center">
                                <TextBlock.Foreground>
                                    <SolidColorBrush Color="#FF555555" x:Name="scb" />
                                </TextBlock.Foreground>
                                <TextBlock.Effect>
                                    <DropShadowEffect BlurRadius="0" Color="#FFE6E6E6" ShadowDepth="1" x:Name="dse" />
                                </TextBlock.Effect>
                            </TextBlock>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <ToggleButton Style="{StaticResource ToggleButtonStyle}" Content="Test" />

Answer 1

实际上，样式正在改变，但是当鼠标悬停在按钮上时，在Checked动画之后会触发MouseOver动画。您可以删除MouseOver动画以获得所需的行为，但是当您将鼠标悬停在按钮上时样式不会更改。

使用ToggleButton，MouseOver上不能有不同的样式，因为此状态属于常见状态。但是，您可以创建自己的控件来支持此功能。 This same question has already been asked here

Answer 2

参见my answer here 我认为你可以在风格上使用相同的方法。

Silverlight ToggleButton检查VisualState无法正常工作

2 个答案: