WPF Mouseover重置控件颜色

时间:2016-11-09 00:05:08

标签: wpf xaml

我正在为radiobutton创建一个样式,并在单击时更改radiobutton的颜色。但是,我想这样,当你mouseover放射性按钮时,它也会改变颜色。我已经实现了基础知识,但是当已选择了无线电按钮(因此具有不同的颜色)时,如果它获得mouseover,则颜色会更改为该新颜色,并且当mouseover完成时(鼠标离开它,颜色变回原始的未选择的颜色。

有没有办法让它知道什么时候点击它才能找到正确的颜色? (TargetName Border只是一个Border类)

<Style x:Key="MyRadioButton" TargetType="{x:Type RadioButton}">
    <Setter Property="SnapsToDevicePixels" Value="true" />
    <Setter Property="FocusVisualStyle" Value="{DynamicResource RadioButtonFocusVisual}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RadioButton}">
                <BulletDecorator Background="Transparent">

                    <BulletDecorator.Bullet>
                        <Grid Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                            <Border x:Name="Border" Margin="1" CornerRadius="5" HorizontalAlignment="Center"
                                    Width="50" Background="White" Padding="2" SnapsToDevicePixels="true">
                                <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
                            </Border>
                        </Grid>
                    </BulletDecorator.Bullet>

                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                        Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                        <EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedUnfocusedColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                            Storyboard.TargetProperty="(Panel.Background).(GradientStop.Color)">
                                        <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlLightColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                        Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                        <EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedBackgroundColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unchecked" />
                            <VisualState x:Name="Indeterminate" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </BulletDecorator>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

1 个答案:

答案 0 :(得分:1)

使用此Style,并将两个差异RadioButton置于测试Unchecked状态:

<Style TargetType="{x:Type RadioButton}">
            <Setter Property="SnapsToDevicePixels" Value="true" />
            <Setter Property="FocusVisualStyle" Value="{DynamicResource RadioButtonFocusVisual}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type RadioButton}">
                        <BulletDecorator Background="Transparent">

                            <BulletDecorator.Bullet>
                                <Grid Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">

                                    <Border x:Name="Border" Margin="1" CornerRadius="5" HorizontalAlignment="Center"
                                        Width="50" Padding="2" SnapsToDevicePixels="true">
                                        <Border.Background>
                                            <VisualBrush>
                                                <VisualBrush.Visual>
                                                    <Grid>
                                                        <Border x:Name="InnerBorder" Margin="1" CornerRadius="5" HorizontalAlignment="Center"
                                    Width="50" Background="Transparent" Padding="2" SnapsToDevicePixels="true"/>
                                                        <Border x:Name="OuterBorder" Margin="1" CornerRadius="5" HorizontalAlignment="Center"
                                    Width="50" Background="Transparent" Padding="2" SnapsToDevicePixels="true"/>

                                                    </Grid>
                                                </VisualBrush.Visual>
                                            </VisualBrush>
                                        </Border.Background>
                                            <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                        </Border>

                                </Grid>
                            </BulletDecorator.Bullet>

                            <VisualStateManager.VisualStateGroups>

                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="OuterBorder"
                                                    Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                                <EasingColorKeyFrame KeyTime="0" Value="Red" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                            Storyboard.TargetProperty="(Panel.Background).(GradientStop.Color)">
                                                <EasingColorKeyFrame KeyTime="0" Value="Pink" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="InnerBorder"
                                        Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                                <EasingColorKeyFrame KeyTime="0" Value="Yellow" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="InnerBorder"
                                        Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
                                                <EasingColorKeyFrame KeyTime="0" Value="Transparent" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>

                                    <VisualState x:Name="Indeterminate" />
                                </VisualStateGroup>

                            </VisualStateManager.VisualStateGroups>
                        </BulletDecorator>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>