Question

我想问你一个我无法解决的问题。我已经如下模板化了WPF TreeView：

 <Style x:Key="TreeViewItemStyle" TargetType="{x:Type TreeViewItem}">
            <Setter Property="Focusable"
                    Value="True" />
            <Setter Property="IsExpanded"
                    Value="True" />
            <Setter Property="Background"
                    Value="Transparent" />
            <Setter Property="HorizontalContentAlignment" 
                    Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
            <Setter Property="VerticalContentAlignment" 
                    Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
            <Setter Property="HorizontalAlignment"
                    Value="Stretch" />
            <Setter Property="Width"
                    Value="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type TreeView}}}" />
            <Setter Property="Foreground"
                    Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TreeViewItem}">
                        <Grid Name="PART_grid">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition MinWidth="19" Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <ToggleButton x:Name="Expander" 
                                          ClickMode="Press" 
                                          IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" 
                                          Style="{StaticResource ExpandCollapseToggleStyle}"/>
                            <Border x:Name="Bd" 
                                    Grid.Column="1" 
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    Background="{TemplateBinding Background}" 
                                    Padding="{TemplateBinding Padding}" 
                                    SnapsToDevicePixels="true">
                                <ContentPresenter x:Name="PART_Header" 
                                                  ContentSource="Header" 
                                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                  SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </Border>
                            <ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" />
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsExpanded" Value="false">
                                <Setter Property="Visibility" TargetName="ItemsHost" Value="Collapsed"/>
                            </Trigger>
                            <Trigger Property="HasItems" Value="false">
                                <Setter Property="Visibility" TargetName="Expander" Value="Hidden"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Cursor" Value="Hand" />
                                <Setter TargetName="PART_grid"
                                        Property="Background"
                                        Value="#e6f2fa" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>                  
                </Setter.Value>                    
            </Setter>
        </Style>

问题在于悬停效果确实很糟糕。实际上，如果用户继续使用TreeviewItem，则效果应该只影响相对的子对象，而不影响整个包装器。

screenshot

如何解决此问题并使悬停效果仅落在单个元素（父元素或子元素）上？

非常感谢，祝大家有个美好的一天

Answer 1

我想您正在使用HierarchicalDataTemplate作为商品。

在这种情况下，“可怕的”悬停效果实际上确实按照您指定的那样起作用。例如。 Sergio项目将包含其他子项目。当您将鼠标悬停在Alessandro上时，Sergio项实际上也包含鼠标，因为该Sergio项是如此之大，并且包含所有其他子项，包括Alessandro。

您现在有两个选择。

在您的数据模板中进行操作，例如：

<HierarchicalDataTemplate ItemsSource="{Binding SubItems}">
    <TextBlock x:Name="HeaderText" Text="{Binding Name}"/>
     <HierarchicalDataTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="HeaderText" Property="Background" Value="Red"/>
        </Trigger>
    </HierarchicalDataTemplate.Triggers>          
</HierarchicalDataTemplate>

或者不在网格上而是仅在标题上设置颜色：

<Trigger Property="IsMouseOver" Value="true" SourceName="Bd">
    <Setter Property="Cursor" Value="Hand" />
    <Setter TargetName="Bd" Property="Background" Value="#e6f2fa" />
</Trigger>

请注意，我在触发器中添加了SourceName="Bd"：我们只想在相应的标题包含鼠标光标时更改颜色。

悬停效果对WPF TreeView的子元素有错误

1 个答案: