代码之家 › 专栏 › 技术社区 › thmsn

WPF显示父子关系

parent-child wpf

thmsn · 技术社区 · 17 年前

我不知道如何完成渲染

public class Shape{}
public class Circle: Shape{}
public class Square: Shape
{
    public List<Circle> CircleList{ get; private set; }
}

我有一个保存形状对象的列表,现在我想要完成的是在网格中渲染每个对象。

如果对象是正方形,则应该有一个嵌套的网格,其中包含来自CircleList属性的圆项。

我尝试过一个itemscontrol和一个hierarchicaldatatemplate,无法使它工作,我尝试了在itemscontrol中嵌套一个itemscontrol,我对wpf非常陌生,所以我在这里有点摸不着头脑,不知道“合适”的解决方案是什么。我确实设法在树视图中渲染了上面的内容,但我要完成的是一个渲染形状的绘图板。

更新

“抽屉板”应包含物品,每个物品应放在容器中呈现。

如果对象的类型为Square,则Square容器应具有一个嵌套容器,用于保存CircleList属性中的Circle对象。

2 回复 | 直到 17 年前

Charlie 17 年前

斯科特很亲近,但不是 相当地 在那里;设置网格的DataContext将不会呈现包含的Circle对象。您需要的是一个嵌入式控件,它可以呈现自己的项,然后将该控件的itemsource属性绑定到CircleList。

我已经用您的原始类构造了一个示例来演示这一点。下面是代码:

public partial class Window1 : Window
{
    public Window1()
    {
        InitializeComponent();

        Square square = new Square();
        square.CircleList = new List<Circle>() { new Circle(25) };
        _shapes.Add(square);
    }

    private List<Shape> _shapes = new List<Shape>();

    public List<Shape> Shapes
    {
        get { return _shapes; }
    }
}

public abstract class Shape { }

public class Circle : Shape
{
    public double Diameter { get; private set; }

    public Circle(double diameter)
    {
        Diameter = diameter;
    }
}

public class Square : Shape
{
    public List<Circle> CircleList { get; set; }
}

所以你可以看到我在我的形状列表中添加了一个正方形,它包含一个直径为25的圆。请注意,这并没有添加任何对使用绝对坐标定位形状的支持;我假设您已经为它准备了一些东西。

现在的XAML:

<Window x:Class="TestWpfApplication.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestWpfApplication"
Title="Window1"
DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Window.Resources>
    <DataTemplate DataType="{x:Type local:Circle}">
        <Ellipse Stroke="Black" 
                 Width="{Binding Diameter}" 
                 Height="{Binding Diameter}"/>
    </DataTemplate>
    <DataTemplate DataType="{x:Type local:Square}">
        <Border BorderThickness="1" BorderBrush="Black">
            <ItemsControl ItemsSource="{Binding CircleList}"/>
        </Border>
    </DataTemplate>
</Window.Resources>

<ListBox ItemsSource="{Binding Shapes}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

这是您的数据模板;您可以看到圆只是用椭圆呈现的。另一方面,正方形有一个嵌入的itemsControl,用于呈现其包含的项。我也在它周围画了一个边界来形成方形。

结果如下:

alt text http://img212.imageshack.us/img212/8658/squarewithcirclecontent.png

Scott Whitlock 17 年前

您可以尝试使用两个数据模板,一个用于圆形(只渲染一个圆形),另一个用于方形。Square数据模板应该呈现一个网格(只需给它一个边框,使其看起来像一个正方形),然后设置嵌套网格的DataContext=“binding CircleList”。

我不完全确定你是如何将形状列表转换为网格的,但听起来你已经解决了这个问题,所以为了简单起见,我将省略这个问题。:)