You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

WPF .NET Core应用中ItemsControl的Panel.ZIndex在Canvas上不生效如何解决

问题根因

你当前绑定的Panel.ZIndex仅作用于ItemsControl内部Canvas的子元素(即每条数据对应的ContentPresenter容器),这些子项都归属于ItemsControl内部的渲染层级。而你外层用户控件的Canvas下,Image和ItemsControl是同级元素,只有ItemsControl自身的Panel.ZIndex能决定它整体和Image的上下关系,内部子项的ZIndex无法跨层级影响和Image的排序。

可行解决方案

方案1:重构布局,将Image移入ItemsControl内部Canvas(改造成本最低)

直接把外层的Image挪到ItemsControl的ItemsPanel模板内的Canvas中,让Image和所有Rectangle对应的ContentPresenter成为同一Canvas下的同级子元素,你原有绑定的RectangleCanvasZIndex就可以直接控制每个Rectangle和Image的上下层关系。
修改后的ItemsPanel代码示例:

<ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
        <Canvas>
            <!-- 把你原来外层的Image移到此处,按需设置Source、Canvas.Left、Canvas.Top等属性 -->
            <Image Source="你的图片资源路径" Canvas.ZIndex="0"/>
        </Canvas>
    </ItemsPanelTemplate>
</ItemsControl.ItemsPanel>

后续只需要调整RectangleCanvasZIndex的值:大于0则Rectangle显示在Image上方,小于0则显示在Image下方,原有其他绑定逻辑无需修改。

方案2:复用外层Canvas作为ItemsControl的宿主面板

如果不想把Image放入ItemsControl内部,可以直接将外层的Canvas设为ItemsControl的ItemsHost,让所有子项直接作为外层Canvas的直接子元素,和Image同级,原有ZIndex绑定自然生效。
修改后的外层布局示例:

<!-- 外层Canvas -->
<Canvas x:Name="OuterCanvas">
    <Image Source="你的图片资源路径" Canvas.ZIndex="0"/>
    <ItemsControl 
        x:Name="itmZoneShapes"
        ItemsSource="{Binding LastSelectedZone.PredefinedSelectedLogicalZones}"
        ItemsPanel="{Binding ElementName=OuterCanvas}">
        <!-- 原有ItemContainerStyle、ItemTemplate代码完全不变 -->
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="ContentPresenter">
                <Setter Property="Canvas.Left" Value="{Binding Path=RectangleCanvasLeft}" />
                <Setter Property="Canvas.Top" Value="{Binding Path=RectangleCanvasTop}" />
                <Setter Property="Panel.ZIndex" Value="{Binding Path=RectangleCanvasZIndex}" />
            </Style>
        </ItemsControl.ItemContainerStyle>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <!-- 原有Rectangle代码不变 -->
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Canvas>

内容的提问来源于stack exchange,提问作者Ionut Grad

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.28 21:36:08