如何在WPF中使用扩展器作为treeview的子项

时间:2014-08-24 06:14:31

标签: c# wpf treeview expander

我想显示一组自定义的重复数据

Class M

 prop1 // treeview heading

 List<String> // treeview items

 List<ClassSub> [ prop 1, porp2 ,List<String> sub items] //as an expander with List<String> as expander items

Class M

  prop1 // treeview heading

  prop2  // treeview items

  List<ClassSub>[prop1 ,prop2,List<String>...]//as an expander

我可以使用Treeview + Expander组合来安排这整套数据吗?

或者我是否需要使用像http://complexdatatemplates.codeplex.com这样的Codeplex图书馆[但我没有看到明确的文档] Sample structre is like it

1 个答案:

答案 0 :(得分:0)

以下是我提供解决问题的方法

XAML

<TreeView ItemsSource="{Binding TreeItems}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding SubItems}">
            <Expander Header="{Binding Header}">
                <ItemsControl Margin="25,0,0,0" ItemsSource="{Binding TreeItems}" />
            </Expander>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

项目类

class Item
{
    public string Header { get; set; }
    public List<string> TreeItems { get; set; }
    public List<Item> SubItems { get; set; }
}

查看模型

class ViewModel 
{
    public ViewModel()
    {
        TreeItems = new ObservableCollection<Item>();
        string[] data = new string[]{
                "Subchapter 1","Subchapter 2",
            };
        Item item = new Item()
        {
            Header = "Sub Getting Started",
            TreeItems = new List<string>(data)
        };

        TreeItems.Add(new Item()
        {
            Header = "Getting Started 1",
            SubItems = new List<Item>(new Item[] { item }),
            TreeItems = new List<string>(data)
        });
        TreeItems.Add(new Item()
        {
            Header = "Getting Started 2",
            SubItems = new List<Item>(new Item[] { item }),
            TreeItems = new List<string>(data)
        });
        TreeItems.Add(new Item()
        {
            Header = "Getting Started 3",
            SubItems = new List<Item>(new Item[] { item }),
            TreeItems = new List<string>(data)
        });
    }

    public ObservableCollection<Item> TreeItems { get; private set; }
}

结果

result

在上面的示例中,我没有设置Expander以匹配发布的屏幕截图中的那个。如果这也是必需的,请告诉我。


修改

如上所述,显示SubChapter1.1。 1.2默认情况下可见,或默认情况下展开任何其他树视图项

首先在资源

中定义TreeViewItem的样式
<TreeView.Resources>
    <Style TargetType="TreeViewItem">
        <Setter Property="IsExpanded"
                Value="{Binding IsExpanded}" />
    </Style>
</TreeView.Resources>

将属性IsExpanded添加到BookChapter类

public class BookChapter
{
    public string name { get; set; }
    public string id { get; set; }
    public List<BookPage> pages { get; set; }
    //public List<Enrichment> enrichment { get; set; }
    public List<SubChapter> chapters { get; set; }

    public bool IsExpanded { get; set; }

}

然后将IsExpanded设置为true,如果您希望它最初展开

BookChapter cha = new BookChapter { name = "Chapter Intro", pages = pags, IsExpanded=true };

结果

result

您也可以以类似的方式控制其他树项目。


编辑2

使用列表框和数据模板进行相同的示例

<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="chapterTemplate">
            <Expander Header="{Binding name}" IsExpanded="{Binding IsExpanded}">
                <StackPanel>
                    <ItemsControl Margin="25,0,0,0"
                                  ItemsSource="{Binding pages}">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <Button Content="{Binding Path=label}">
                                </Button>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                    <ListBox ItemsSource="{Binding chapters}"
                             BorderBrush="{x:Null}"
                             Margin="20,0,0,0" />
                </StackPanel>
            </Expander>
        </DataTemplate>
        <DataTemplate DataType="{x:Type l:BookChapter}">
            <ContentControl Content="{Binding}"
                            ContentTemplate="{StaticResource chapterTemplate}" />
        </DataTemplate>
        <DataTemplate DataType="{x:Type l:SubChapter}">
            <ContentControl Content="{Binding}"
                            ContentTemplate="{StaticResource chapterTemplate}" />
        </DataTemplate>

        <DataTemplate DataType="{x:Type l:BookPage}">
            <Button Content="{Binding Path=label}" />
        </DataTemplate>
    </Grid.Resources>

    <ListBox ItemsSource="{Binding}"
             Name="TOCView" />
</Grid>

结果

result

使用此方法,您可能不需要为箭头的树视图项模板。只需按照您的意愿模板扩展器

作为建议,您可以将BookChapter类重用为子章节,而不是为SubChapter创建新类,除非必要。