悬浮ListBoxItem下的阴影（而不是它的文本下）

Question

我需要ListBoxItem MouseOver下的影子。底部代码有效，但包含TextBlock字母的整个列表框都有一个阴影：

<ListBox  ItemContainerStyle="{StaticResource Style1}"

项目Style：

<Style x:Key="Style1" TargetType="{x:Type ListBoxItem}">             
    <Style.Triggers>                    
        <Trigger Property="IsMouseOver" Value="True" >
            <Setter Property = "Effect"  >
                <Setter.Value>
                    <DropShadowEffect ShadowDepth="10" Direction="0" Opacity="1" BlurRadius="5" Color="Black"/>
                </Setter.Value>
            </Setter>
        </Trigger>

简化DataTemplate：

<DataTemplate x:Key="TemplateSimple" >
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="{Binding Title}" Grid.Column="0"/>
        <TextBlock Text="{Binding FirstName}" Grid.Column="1"/>
        <TextBlock Text="{Binding LastName}" Grid.Column="2"/>

简化了示例。

我也尝试添加到DataTemplate：

<Rectangle Grid.Column="0" Fill="GreenYellow" Grid.ColumnSpan="3"> 

并为其指定阴影，但仅当TextBlock为空时它才会作出反应。其他想法值得赞赏。

修改 正如你所看到的，它不是真正的阴影，而是模糊的文字。如果它是一个阴影，它会在改变阴影长度时发生很大变化：

Answer 1

请参阅此帖子How do I apply an effect to a Border but not to its contents in WPF?，其中包含有关此“功能”的一些文档。

您案例中最简单的解决方法可能是为您的DataTemplate格式提供背景颜色：

<DataTemplate x:Key="TemplateSimple" >
    <Grid Background="White" > ...

修改

更彻底的方法是将DropShadowEffect应用于位于文本下方的元素，但不包含文本。例如，在DataTemplate：

中添加一个矩形

<DataTemplate x:Key="TemplateSimple" >
    <Grid Margin="2" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Rectangle Style="{StaticResource RectStyle1}" 
                   Fill="Lime" Grid.ColumnSpan="3" />

        <TextBlock Text="{Binding Title}" Grid.Column="0" />
        <TextBlock Text="{Binding FirstName}" Grid.Column="1" />
        <TextBlock Text="{Binding LastName}" Grid.Column="2" />
    </Grid>
</DataTemplate>

..而不是在Style1中使用DropShadowEffect，将其放在RectStyle1中，但仍由父ListBoxItem上的IsMouseOver触发：

<Style x:Key="RectStyle1" TargetType="Rectangle" >
    <Style.Triggers>
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem},
                                       Path=IsMouseOver, 
                                       Mode=OneWay}" 
                     Value="True" >
            <Setter Property="Effect" >
                <Setter.Value>
                    <DropShadowEffect ShadowDepth="10" Direction="0" 
                                      Opacity="1" BlurRadius="5" 
                                      Color="Black" />
                </Setter.Value>
            </Setter>
        </DataTrigger>
    </Style.Triggers>
</Style>