ZIndex 不适用于 ContentControl?

ZIndex doesn't work with ContentControl?

我正在尝试通过使用包含形状控件(例如矩形、椭圆)的 Canvas 叠加控件来创建地板布局。布局的一部分是一个包含三个圆圈的矩形。由于圈子是相同的 size/color,我为他们创建了一个资源。我试图将圆圈放在矩形的顶部。我的问题是只出现最后一个圆圈。我尝试使用 Panel.Zindex,但它不起作用。

经过一些实验,我发现问题似乎是 ZIndex 不能与 ContentControl 一起使用。如果我用 Ellipse 替换 ContentControl,那么它工作正常。我已经尝试过其他方法,但问题似乎是 ContentControl 不服从 ZIndex。我试过在 Canvas 周围使用边框。我试过不使用矩形并填充 Canvas 背景。

下面是我的 XAML 示例,说明哪些有效,哪些无效。

<Window.Resources>
    <ResourceDictionary>
        <Ellipse x:Key="MyCircle" Fill="Black" Width="1.5" Height="1.5"/>

        <!--uses resource, but only shows last ellipse-->
        <Canvas x:Key="LastEllipseOnly">
            <Rectangle Fill="DarkGray" Width="6" Height="2.5" />

            <ContentControl Content="{StaticResource MyCircle}" Canvas.Left="0.5" Canvas.Top="0.5"/>
            <ContentControl Content="{StaticResource MyCircle}" Canvas.Left="2.25" Canvas.Top="0.5"/>
            <ContentControl Content="{StaticResource MyCircle}" Canvas.Left="4.0" Canvas.Top="0.5"/>
        </Canvas>

        <!--this works, but it does not use the resource-->
        <Canvas x:Key="Working"  Width="6" Height="2.5">
                <Rectangle Fill="DarkGray" Width="6" Height="2.5"/>

                <Ellipse Fill="Black" Width="1.5" Height="1.5" Canvas.Left="0.5" Canvas.Top="0.5"/>
                <Ellipse Fill="Black" Width="1.5" Height="1.5" Canvas.Left="2.25" Canvas.Top="0.5"/>
                <Ellipse Fill="Black" Width="1.5" Height="1.5" Canvas.Left="4.0" Canvas.Top="0.5"/>
        </Canvas>
    </ResourceDictionary>
</Window.Resources>

<Viewbox>
    <Canvas Height="50" Width="50">
        <ContentControl Content="{StaticResource LastEllipseOnly}" Canvas.Left="10" Canvas.Top="10"/>

        <ContentControl Content="{StaticResource Working}" Canvas.Left="40" Canvas.Top="40"/>
    </Canvas>
</Viewbox>

这不是 ZIndex。问题是 Ellipse 资源只有一个实例,它被重复用作多个 ContentControl 的 Content。但是,一个元素只能添加一次到可视化树中。

您可以通过将 x:Shared 属性设置为 false 告诉 WPF 它应该创建资源的多个实例来绕过此限制:

<Ellipse x:Key="MyCircle" ... x:Shared="False"/>