画布Z订单问题

Question

我试图渲染一串椭圆，从中心，北，东，南，西方向出来的线。

但是，我也需要所有的椭圆在之间，所有的行，而不仅仅是在它自己的行上。

使用下面的代码，我不能做到这一点，因为每个项目模板有自己的画布，所以设置zindex不会帮助。

任何想法，我怎么能解决这个问题？

<Window x:Class="WpfApplication27.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="800" Width="800"> 
    <ItemsControl ItemsSource="{Binding Nodes}"> 
     <ItemsControl.Template> 
      <ControlTemplate> 
       <Grid> 
        <Canvas Name="PART_Canvas" IsItemsHost="True"/> 
       </Grid> 
      </ControlTemplate> 
     </ItemsControl.Template> 

     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Canvas> 
        <Line X1="25" Y1="25" X2="25" Y2="125" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="25" Y2="-75" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="125" Y2="25" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="-75" Y2="25" Stroke="Black"/> 
        <Ellipse Width="50" Height="50" Fill="Red"/> 
       </Canvas> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 

     <ItemsControl.ItemContainerStyle> 
      <Style TargetType="ContentPresenter"> 
       <Setter Property="Canvas.Left" Value="{Binding X}"/> 
       <Setter Property="Canvas.Top" Value="{Binding Y}"/> 
      </Style> 
     </ItemsControl.ItemContainerStyle> 
    </ItemsControl> 
</Window> 

Answer 1

你可以相互结合的顶部加入2 ItemsCotrols同一个集合，背一会渲染线和前一个呈现椭圆形的

<Grid> 
    <Grid.Resources> 
     <Style x:Key="NodeContainer" TargetType="ContentPresenter"> 
      <Setter Property="Canvas.Left" Value="{Binding X}"/> 
      <Setter Property="Canvas.Top" Value="{Binding Y}"/> 
     </Style> 
    </Grid.Resources> 

    <!--Line--> 
    <ItemsControl ItemsSource="{Binding Nodes}" ItemContainerStyle="{StaticResource NodeContainer}"> 
     <ItemsControl.Template> 
      <ControlTemplate> 
       <Grid> 
        <Canvas Name="PART_CanvasBack" IsItemsHost="True"/> 
       </Grid> 
      </ControlTemplate> 
     </ItemsControl.Template> 

     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Canvas> 
        <Line X1="25" Y1="25" X2="25" Y2="125" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="25" Y2="-75" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="125" Y2="25" Stroke="Black"/> 
        <Line X1="25" Y1="25" X2="-75" Y2="25" Stroke="Black"/> 
       </Canvas> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 

    <!--Ellipse--> 
    <ItemsControl ItemsSource="{Binding Nodes}" ItemContainerStyle="{StaticResource NodeContainer}"> 
     <ItemsControl.Template> 
      <ControlTemplate> 
       <Grid> 
        <Canvas Name="PART_CanvasFront" IsItemsHost="True"/> 
       </Grid> 
      </ControlTemplate> 
     </ItemsControl.Template> 

     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Canvas> 
        <Ellipse Width="50" Height="50" Fill="Red"/> 
       </Canvas> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 

</Grid>