Canvas Z Order问题

时间:2013-05-31 23:43:39

标签: wpf canvas z-order

我试图渲染一堆椭圆,其中的线条从中心向北,东,南,西方向射出。

但是,我还需要所有省略号都位于所有行之上,而不仅仅是在它自己的行之上。

使用以下代码,我不能这样做,因为每个项目模板都有自己的画布,因此设置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>

1 个答案:

答案 0 :(得分:0)

你可以在相同的集合上添加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>