ZIndex не работает с ContentControl?

Question

Я пытаюсь создать макет пола путем наложения элементов управления с помощью Canvas, который содержит элементы управления фигурой (например, Rectangle, Ellipse). Одна часть макета - это прямоугольник, который содержит три круга. Поскольку круги имеют одинаковый размер/цвет, я создал для них ресурс. Я пытаюсь поместить круги поверх прямоугольника. Моя проблема в том, что появляется только последний круг. Я попытался использовать Panel.Zindex, но он не работает.

После некоторых экспериментов я обнаружил, что проблема заключается в том, что ZIndex не работает с ContentControl. Если я заменил ContentControl на Ellipse, тогда он отлично работает. Я пробовал альтернативные методы, но проблема заключается в том, что ContentControl не подчиняется ZIndex. Я попытался использовать рамку вокруг холста. Я пробовал использовать прямоугольник и заполнять фон 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>

Answer 1

Это не ZIndex. Проблема в том, что существует только один экземпляр ресурса Ellipse, который неоднократно используется как Content нескольких ContentControls. Однако элемент может быть добавлен только один раз в визуальное дерево.

Вы можете обойти это ограничение, говоря WPF, что он должен создать несколько экземпляров ресурса, установив атрибут x:Shared ложь:

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