Question

我做了ToggleButton的扩展。它继承自ToggleButton，我有一些依赖属性。我希望标签和文本在鼠标悬停时以及IsChecked为真时高亮显示。

Desrered results

正常状态：深色文字
MouseOver：浅色文字
选中：浅色文字

在正常状态和鼠标悬停时工作正常。当我切换按钮时，当我从中移除鼠标时它仍然会突出显示。但当我再次盘旋时，文字又回到黑暗状态，就像它没有被检查一样。我究竟做错了什么？（如果我删除鼠标悬停状态，文本仍会在拼图时突出显示）是否因为鼠标悬停和检查是在不同的visualstategroups中？

这是我在generic.xaml中的代码

<Style TargetType="{x:Type view:ExtendedToggleButton}">
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="BorderBrush" Value="{DynamicResource LineBrush}" />
    <Setter Property="Padding" Value="5" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type view:ExtendedToggleButton}">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <!--<ColorAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="{DynamicResource BackgroundMouseOverColor}"/>-->
                                    <ColorAnimation Duration="0" Storyboard.TargetName="LabelControl" Storyboard.TargetProperty="(Label.Foreground).(SolidColorBrush.Color)" To="{DynamicResource TitleColor}"/>
                                    <ColorAnimation Duration="0" Storyboard.TargetName="TextControl" Storyboard.TargetProperty="(Label.Foreground).(SolidColorBrush.Color)" To="{DynamicResource DetailTextColor}"/>

                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ColorAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="{DynamicResource BackgroundMousePressedColor}"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To=".55"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <Storyboard>
                                    <ColorAnimation Duration="0" Storyboard.TargetName="LabelControl" Storyboard.TargetProperty="(Label.Foreground).(SolidColorBrush.Color)" To="{DynamicResource TitleColor}"/>
                                    <ColorAnimation Duration="0" Storyboard.TargetName="TextControl" Storyboard.TargetProperty="(Label.Foreground).(SolidColorBrush.Color)" To="{DynamicResource DetailTextColor}"/>

                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unchecked"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused" />
                            <VisualState x:Name="Unfocused" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Background" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
                        <Grid Background="{TemplateBinding Background}"  Margin="1">

                        </Grid>
                    </Border>
                    <StackPanel>
                        <WrapPanel Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}">
                            <TextBlock x:Name="LabelControl" Margin="0 0 10 0" FontSize="14" Foreground="{DynamicResource DescreteTitleBrush}" Text="{TemplateBinding Label}" />
                            <TextBlock x:Name="TextControl" Margin="5 2 0 0" FontSize="12" Foreground="{DynamicResource DarkDetailTextBrush}" TextWrapping="Wrap" Text="{TemplateBinding Text}" />
                        </WrapPanel>
                        <ContentPresenter 
                                  x:Name="contentPresenter"
                                  Content="{TemplateBinding Content}"
                                  ContentTemplate="{TemplateBinding ContentTemplate}"/>
                    </StackPanel>
                    <Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" Opacity="0" IsHitTestVisible="false" />
                </Grid>

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

我尝试过向ControlTemplate添加触发器，但它没有帮助。

<ControlTemplate.Triggers>
    <Trigger Property="IsChecked" Value="True">
        <Setter TargetName="LabelControl" Property="Foreground" Value="{DynamicResource TitleBrush}" />
    </Trigger>
</ControlTemplate.Triggers>

Answer 1

我解决了它跳过VisualStateManager而改为使用名为TitleBrush和DescriptionBrush的其他依赖属性。我使用TemplateBinding绑定TextBlocks的Foreground，然后使用IsChecked和IsMouseOver的触发器设置TitleBrush和DescriptionBrush。

<Style TargetType="{x:Type view:ExtendedToggleButton}">
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="BorderBrush" Value="{DynamicResource LineBrush}" />
    <Setter Property="Padding" Value="5" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type view:ExtendedToggleButton}">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver" />
                            <VisualState x:Name="Pressed"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To=".55"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked"/>
                            <VisualState x:Name="Unchecked"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused" />
                            <VisualState x:Name="Unfocused" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Background" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
                        <Grid Background="{TemplateBinding Background}"  Margin="1">

                        </Grid>
                    </Border>

                    <StackPanel>
                        <WrapPanel Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}">
                            <TextBlock x:Name="LabelControl" Margin="0 0 10 0" FontSize="14" Foreground="{TemplateBinding TitleBrush}" Text="{TemplateBinding Label}" />
                            <TextBlock x:Name="TextControl" Margin="5 2 0 0" FontSize="12" Foreground="{TemplateBinding DescriptionBrush}" TextWrapping="Wrap" Text="{TemplateBinding Text}" />

                        </WrapPanel>
                        <ContentPresenter 
                                  x:Name="contentPresenter"
                                  Content="{TemplateBinding Content}"
                                  ContentTemplate="{TemplateBinding ContentTemplate}"/>
                    </StackPanel>
                    <Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" Opacity="0" IsHitTestVisible="false" />
                </Grid>

                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="False">
                        <Setter Property="TitleBrush" Value="{DynamicResource DescreteTitleBrush}" />
                        <Setter Property="DescriptionBrush" Value="{DynamicResource DarkDetailTextBrush}" />
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="TitleBrush" Value="{DynamicResource TitleBrush}" />
                        <Setter Property="DescriptionBrush" Value="{DynamicResource DetailTextBrush}" />
                    </Trigger>

                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="TitleBrush" Value="{DynamicResource TitleBrush}" />
                        <Setter Property="DescriptionBrush" Value="{DynamicResource DetailTextBrush}" />
                    </Trigger>
                </ControlTemplate.Triggers>

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

这是一个依赖属性

public const string DescriptionBrushPropertyName = "DescriptionBrush";

public Brush DescriptionBrush
{
    get
    {
        return (Brush)GetValue(DescriptionBrushProperty);
    }
    set
    {
        SetValue(DescriptionBrushProperty, value);
    }
}

public static readonly DependencyProperty DescriptionBrushProperty = DependencyProperty.Register(
    DescriptionBrushPropertyName,
    typeof(Brush),
    typeof(ExtendedToggleButton),
    new UIPropertyMetadata(new SolidColorBrush(Colors.White)));

鼠标悬停后，WPF ToggleButton状态重置为正常状态而未检查状态

1 个答案: