边看书边做边发挥-图书软件-6

类库代码告一段落，现在在 Books 项目文件夹下的 Book 项目设为启动项，开始 WPF 桌面程序的编程，在Grid 标记下添加一个两列的网络，左列为目录视图，右列为详细信息，构成主详细信息展示。左列为整个网络的3分之1，右列为3分之2

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="2*"/>
        </Grid.ColumnDefinitions>
    </Grid>

对 EuropeanCastle.Books 项目的引用，在窗口里添加这个空间别名引用

xmlns:books="clr-namespace:EuropeanCastle.Books;assembly=EuropeanCastle.Books"

添加两本书类的资源，设置资源名

    <Window.Resources>
        <books:FrameworkDesignGuidelinesBook x:Key="FrameDesGuiddelinesBookKey"/>
        <books:WpfProgrammingValuables2012Book x:Key="WpfPrgValuales2012BookKey"/>
    </Window.Resources>

在左列添加 Border 控件标签，背景灰色，里面包含一个四行的 Grid 网络面板标签，数据上下文绑定到一本书的资源键，从上到下分别3个 TextBlock 控件标签，书名绑定为默认绑定，这会从上层标签的 DataContext 数据上下文获得数据， 并且换行，TreeView 控件标签绑定路径为 Catalogue ，这会从上下文的数据中提取 Catalogue 属性，他一个集合，这里的 Grid 面板的 DataContext 数据上下文是资源键FrameDesGuiddelinesBookKey，他是之前类库创建的一本书的类

        <Border Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}">
            <Grid DataContext="{Binding Source={StaticResource FrameDesGuiddelinesBookKey}}">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.Resources>
                    <Style x:Key="TitleKey" TargetType="TextBlock">
                        <Setter Property="FontSize" Value="14"/>
                        <Setter Property="Margin" Value="10 5 10 0"/>
                    </Style>
                </Grid.Resources>
                <TextBlock Grid.Row="0" Text="书名:" 
                            Style="{StaticResource TitleKey}"/>
                <TextBlock Grid.Row="1" Text="{Binding}" 
                            TextWrapping="Wrap" FontWeight="Bold"/>
                <TextBlock Grid.Row="2" Text="目录:" 
                            Style="{StaticResource TitleKey}"/>
                <TreeView Grid.Row="3" Grid.Column="0" FontSize="14" 
                            Name="CatalogueTreeView" Margin="10 10 10 10"/>
            </Grid>
        </Border>

右列添加一个Border 控件标签， 背景浅黄，里面添加 StankPanel 面板标签，面板元素绑定到左列的 TreeView 控件的 SelectedItem 属性，这样以从左边选择的项获得信息。

现在桌面程序的效果图如下

这里的树控件只是绑定到第一层目录，没有显示第二层，第三层，现在完成他，让他显示多层次的目录信息，这需要编写 TreeView 控件的项分层数据模版，有多少层次，就编写多少层，并设置绑定表达式，把这段数据模板放到 TreeView 控件上层的 Grid 面板资源里最好，而不必放到窗口，资源放到最近使用控件的上层元素这样比较好，这总是较好的方式，除非让窗口其他地方使用，就定义在窗口资源里

上面已经定义了1个样式，让 Grid 里的 TextBlock 控件使用一些相同的样式，现在添加 TreeView 控件的项分层数据模版，注意每一层都要设置 ItemsSource 绑定，好让他从这个层的数据中绑定到下层的集合，就像是集合的每项，每项里面又有集合

<Grid.Resources>
                    <Style x:Key="TitleKey" TargetType="TextBlock">
                        <Setter Property="FontSize" Value="14"/>
                        <Setter Property="Margin" Value="10 5 5 0"/>
                    </Style>
                    <HierarchicalDataTemplate x:Key="CatalogueHierarchicalKey" ItemsSource="{Binding Sections}">
                        <TextBlock Text="{Binding}"/>
                        <HierarchicalDataTemplate.ItemTemplate>
                            <HierarchicalDataTemplate ItemsSource="{Binding Sections}">
                                <TextBlock Text="{Binding}"/>
                                <HierarchicalDataTemplate.ItemTemplate>
                                    <HierarchicalDataTemplate ItemsSource="{Binding Sections}">
                                        <TextBlock Text="{Binding}"/>
                                    </HierarchicalDataTemplate>
                                </HierarchicalDataTemplate.ItemTemplate>
                            </HierarchicalDataTemplate>
                        </HierarchicalDataTemplate.ItemTemplate>
                    </HierarchicalDataTemplate>
                </Grid.Resources>

首层是 Catalogue 集合属性，TreeView 的 ItemsSource 属性已经绑定，他的管理的对象是 Chapter 类型的对象，这没关系，他有Sections 属性集合，分层数据模板 ItemsSource 属性绑定他做为第二层，第三层是 Section 项又有 Sections 集合属性，让他成为第四层的绑定

添加对 TreeView 控件 ItemTemplete 绑定

                <TreeView Grid.Row="3" Grid.Column="0" 
                          ItemsSource="{Binding Catalogue}" 
                          ItemTemplate="{StaticResource CatalogueHierarchicalKey}"
                          FontSize="14" Name="CatalogueTreeView" Margin="10 5 5 10"/>

测试是否绑定正常

我在 FrameworkDesignGuidelinesBook 类的构造函数添加了第四层数据，测试是否显示正常，现在都正常绑定了