1

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

我希望 Checked 具有与 Pressed 相同的 VisualState，并且 Pressed 工作正常，但是当 ToggleButton 被按下并且状态随后被选中时，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" />
4

2 回答 2

2

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

使用 ToggleButton 您不能在 MouseOver 上有不同的样式，因为此状态属于常见状态。不过，您可以创建自己的控件来支持这一点。这里已经提出了同样的问题。

于 2011-08-24T23:53:39.667 回答
0

在这里查看我的答案， 我认为您可以在风格上使用相同的方法。

于 2012-02-15T08:59:14.490 回答