多级扩展器

Question

我有以下数据结构

public class enrichment
{
    public string name { get; set; }
    public string type { get; set; }
}
public class Pages
{
    public string name { get; set; }
    public List<enrichment> enrichment { get; set; }
    public string label { get; set; }
}
public class SubChapter
{
    public string name { get; set; }
    public string id { get; set; }
    public List<Pages> pages { get; set; }
    public string parentId { get; set; }
}
public class Chapter
{
    public string name { get; set; }
    public string id { get; set; }
    public List<Pages> pages { get; set; }
    public List<SubChapter> chapters { get; set; }
}
public class TOCData
{
    public List<Chapter> chapters { get; set; }
}

样本数据看起来像这样

Chapter 1
  page 1
  page 2
  Chapter 1.1 
      page a
      page b          
Chapter 2 
   page 3
Chapter 3 
   chapter 3.1
      page c
      page d          

我想在扩展器控件中呈现此数据，并且我能够使用这里解释的结构http://pastebin.com/W8Nx857K为2个级别做到这一点但我不能重复它到下一个级别(即当一个章节包含子章节)我怎么能代表它在我的扩展器。我所做的是在扩展器中绑定页。我的问题是如何添加章节。我是否可以绑定它简单或我需要手动创建控件是否有任何示例或修改代码的建议

Answer 1

通常你可以用一个包含扩展器的自定义模板来使用TreeView。应该需要1/2小时，或者如果你的结构真的很严格，你创建2个控件(ChapterViewer和PageViewer，并从ItemsControl派生两者。它们的DataContext将是你相应的类。然后，您可以为它们定义datatemplate，这意味着Chapter将由ChapterViewer可视化地表示，而Page将由PageViewer可视化地表示。这允许你以你想要的方式构建你的结构。但它的结构有点固定。我会使用模板化的TreeView。

编辑->这是我创建的示例代码(http://1drv.ms/Tdq2Re):

)

ViewModel.cs(基本数据结构):

public ViewModel()
        {
            this.TocData = new TOCData
            {
                Name = "Chapters",
                Chapters = new ObservableCollection<Chapter>
                {
                    new Chapter{ Name="Chapter 1", 
                        Elements = new ObservableCollection<ViewModelBase>
                        {
                            new Chapter
                            {
                                Name = "Introduction", 
                                Elements = new ObservableCollection<ViewModelBase>
                                {
                                    new Page(){Label = "Page I"},
                                    new Page(){Label = "Page II"},
                                    new Page(){Label = "Page III"}
                                }
                            },
                            new Page(){Label = "Page 1"},
                            new Page(){Label = "Page 2"},
                            new Page(){Label = "Page 3"},
                            new Page(){Label = "Page 4"},
                        }},            
                    new Chapter{ Name="Chapter 2", Elements = new ObservableCollection<ViewModelBase>
                        {              
                            new Page(){Label = "Page 5"},
                            new Page(){Label = "Page 6"},
                            new Page(){Label = "Page 7"},
                            new Page(){Label = "Page 8"},
                        }},
                }
            };
        }

它是这样使用的:

<Grid>
   <local:ChapterControl ItemsSource="{Binding Path=TocData.Chapters}"  />
</Grid>

ChapterControl.xaml.cs (CustomControl):

 public class ChapterControl : ItemsControl
    {
        static ChapterControl()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(ChapterControl), new FrameworkPropertyMetadata(typeof(ChapterControl)));
        }
    }

和样式等控件:

<!-- Chapter Template -->
    <DataTemplate x:Key="ChapterTemplate"  DataType="local:Chapter">
        <StackPanel>
            <local:ChapterControl  ItemsSource="{Binding Path=Elements}" />
        </StackPanel>
    </DataTemplate>
    <!-- Page Template -->
    <DataTemplate x:Key="pageTemplate"  DataType="local:Page">
        <TextBlock Text="{Binding Label}" Margin="25,0,0,0" />
    </DataTemplate>
    <local:ChapterItemStyleSelector x:Key="chapterItemStyleSelector" PageTemplate="{StaticResource pageTemplate}" ChapterTemplate="{StaticResource ChapterTemplate}" />
    <Style TargetType="{x:Type local:ChapterControl}">
        <Setter Property="ItemTemplateSelector" Value="{StaticResource chapterItemStyleSelector}" />
        <Setter Property="Margin" Value="10,0,0,0" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:ChapterControl}">
                    <Expander Header="{Binding Name}">
                        <ItemsPresenter />
                    </Expander>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Answer 2

我的建议是去掉SubChapter，把Chapter的list改成List<Chapter>。

然后为Chapter创建一个UserControl，其中包含一个Expander，一个ListBox用于页面，一个ListBox用于章节。