为什么我的投影被其他物品遮挡了？

Question

我有一个带有数据模板的ItemsControl，当用户将鼠标悬停在某个项目的某些部分上时，我希望显示一个投影。但是，投影正被ItemsControl中的后续项目切断。

XAML：

<Window x:Class="DropShadowTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:po        ="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
    Title="MainWindow" 
    Height="350" Width="525" 
    Loaded="Window_Loaded" 
    UseLayoutRounding="True" 
    SnapsToDevicePixels="True">
<Window.Resources>
    <DropShadowEffect   po:Freeze="true"    x:Key="BuyOrderFlagShadow"  Color="#FF000000" Direction="0" ShadowDepth="0" BlurRadius="15" RenderingBias ="Quality"    Opacity =".65"/>
</Window.Resources>
<Grid>
    <ItemsControl Name="itemsControl" Margin="25">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Grid Name="borderLeft" Grid.Column="0" Background="LightGray" >
                        <Border BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding Name}" Margin="5"/>                           
                        </Border>
                    </Grid>
                    <Grid Name="borderCenter" Grid.Column="1" Background="LightGray" >
                        <Border BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding City}" Margin="5"/>
                        </Border>
                    </Grid>
                    <Grid Name="borderRight" Grid.Column="2" Background="LightGray" >
                        <Border BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding State}" Margin="5"/>
                        </Border>
                    </Grid>
                </Grid>
                <DataTemplate.Triggers>
                    <Trigger Property="IsMouseOver" SourceName="borderLeft" Value="true">
                        <Setter Property="Effect" Value="{StaticResource BuyOrderFlagShadow}" TargetName="borderLeft"/>
                        <Setter Property="ZIndex" Value="1000" TargetName="borderLeft"/>
                    </Trigger>
                    <Trigger Property="IsMouseOver" SourceName="borderRight" Value="true">
                        <Setter Property="Effect" Value="{StaticResource BuyOrderFlagShadow}" TargetName="borderRight"/>
                        <Setter Property="ZIndex" Value="1000" TargetName="borderRight"/>
                    </Trigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>
</Window>

当我将鼠标悬停在某个项目上时，会发生以下情况：

我将ZIndex属性添加到触发器以尝试解决问题。在此之前，投影仅出现在网格的左侧和顶部。任何帮助表示赞赏。

Answer 1

感谢用户2760623，我调查了整个项目的Z索引。使用this question，我使用ItemContainerStyle：

提出了以下解决方案

<Window x:Class="DropShadowTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:po        ="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
        Title="MainWindow" 
        Height="350" Width="525" 
        Loaded="Window_Loaded" 
        UseLayoutRounding="True" 
        SnapsToDevicePixels="True">
    <Window.Resources>
        <DropShadowEffect   po:Freeze="true"    x:Key="BuyOrderFlagShadow"  Color="#FF000000" Direction="0" ShadowDepth="0" BlurRadius="15" RenderingBias ="Quality"    Opacity =".65"/>
    </Window.Resources>
    <Grid>
        <ItemsControl Name="itemsControl" Margin="25">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Border Name="borderLeft"       Panel.ZIndex="-1"   Grid.Column="0" Background="LightGray" BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding Name}" Margin="5"/>
                        </Border>
                        <Border Name="borderCenter"     Panel.ZIndex="-1"   Grid.Column="1" Background="LightGray" BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding City}" Margin="5"/>
                        </Border>
                        <Border Name="borderRight"      Panel.ZIndex="-1"   Grid.Column="2" Background="LightGray" BorderBrush="Black" BorderThickness="0">
                            <TextBlock Text="{Binding State}" Margin="5"/>
                        </Border>
                    </Grid>
                    <DataTemplate.Triggers>
                        <Trigger Property="IsMouseOver" SourceName="borderLeft" Value="true">
                            <Setter Property="Effect"       Value="{StaticResource BuyOrderFlagShadow}" TargetName="borderLeft"/>
                            <Setter Property="Panel.ZIndex" Value="100" TargetName="borderLeft"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" SourceName="borderRight" Value="true">
                            <Setter Property="Effect"       Value="{StaticResource BuyOrderFlagShadow}" TargetName="borderRight"/>
                            <Setter Property="Panel.ZIndex" Value="100" TargetName="borderRight"/>
                        </Trigger>
                    </DataTemplate.Triggers>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="{x:Type ContentPresenter}">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Panel.ZIndex" Value="100"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ItemsControl.ItemContainerStyle>
        </ItemsControl>
    </Grid>
</Window>

现在我得到了我期望的行为：