11_01_深入浅出话模板

备注：类关系结构图如下：

模板（Template）

ControlTemplate 和 DataTemplate引入

WPF 中通过引入模板（Template）微软将数据和算法的“内容”和“形式”解耦了，WPF 中的 Template 分为两大类：

• ControlTemplate 是算法内容的表现形式，一个控件怎么组织其内部形式才能让它更符合业务逻辑，让用户更舒服的操作它。它决定了控件“长成什么样子”。
• DataTemplate 是数据内容的表现形式，例如 TextBlock 的 Text 属性关联到 数据对象的 Year 属性上等。
• Template 就是外衣 ----ControlTemplate 是控件的外衣，DataTemplate 是数据的外衣。

ControlTemplate 和 DataTemplate

DataTemplate

• 一个例子
  
  
  
  
  
  
  备注：
  • DataTemplate 常用的地方有三处，分别是
    • ContentControl 的 ContentTemplate 属性，相当于给 ContentControl 的内容穿衣服。
    • ItemsControl 的 ItemTemplate 属性，相当于给 ItemsControl 的数据条目穿衣服。
    • GridViewColumn 的 CellTemplate 属性，相当于给 GridViewColumn 单元格里数据穿衣服。
  • DataTemplate 有 x:Key 用来调用的。本例子中有两个 DataTemplate 一个是用来做 ContentTemplate，是 UserControl 的属性，另一个是用来做 ItemTemplate，是 ListBox 的属性。他们都以静态资源的形式引入。
  • 本实例中两个转换器都是以静态资源的资源引入或者调用的。
  • Binding 只写了 Path 至于 Source 自己按照逻辑树寻找就好。

ControlTemplate

• 一个例子
  • 操作流程：TextBox 上右击 -> Edit Template -> Edit a Copy -> 写 x:Key -> Difine in （Application） -> OK -> 修改 ControlTemplate 即可。
  • 代码例子(将 TextBox 的边框改成圆角的)：
    
    备注：
    • ControlTemplate 是直接将原来的 ListBoxChrome 标签替换成了 Border 标签，去掉 Border 不具备的属性并添加了 CornerRadius=“5”;
    • 他的调用是 Style 并用动态资源加载的。<TextBox Style="{DynamicResource RoundCornerTextBoxStyle}" ... >
    • 看似 ControlTemplate 和 Style 都可以改变控件的外观，其实该例子看出来，ControlTemplate 只是 Style 的一个属性而已，两个是一个意思。

ItemsControl 的 PanelTemplate

• ItemsControl 具有一个名为 ItemsPanel 的属性，他的数据类型是 ItemsPanelTemplate，ItemsPanelTemplate 也是一种控件 Template。

• 一个例子,通常 ListBox 布局是竖直的，下面代码结果是水平的。
  

DataTemplate 与 ControlTemplate 的例子扩展

1. 利用 ControlTemplate 和 Style 将样式应用在所有目标上

备注：

• 应为是应用在所有目标上，所以 Style 不能标记 x:Key.
• 下面默认会带上上面预先指定的样式，但是如果不想应用，可以Style="{x:Null}"。

2. DataTemplate 有一个 DataType 属性，可以指定数据类型形式。


备注：

• DataTemplate 作为资源时也不带有 x:Key 标记。
• DataTemplate 可以作为数据的数据类型。

3. DataTemplate 利用 DataType 属性，作用在 XML 数据上

4. HierarchicalDataTemplate 可以显示类似折叠菜单栏的效果

寻找 Template 内部的控件（由LogicalTree找VisualTree）

• ControlTemplate 和 DataTemplate 两个类均派生自 FrameworkTemplate，这个类有个名我 FindName 的方法，用于检索内部控件.
• ControlTemplate 和 DataTemplate 生成的控件都是由 Template 生成的控件。

寻找 ControlTemplate 内部控件

备注：

• ControlTemplate 也可以像前面例子中 DataTemplate 一样用。
• 注意 ControlTemplate 调用 <UserControl x:Name="uc" Template="{StaticResource cTemp}" Margin="5">
• 在 tb 本身是控件，控件就有属性 Parent、Children 数组等。

寻找 DataTemplate 内部控件

• 一个例子
  
  
  
  备注：
• 注意他的结构： Grid -> ListView -> ListView.View -> GridView -> GridViewColumn
• 获取 TextBox 的焦点，并处理（获取 DataTemplate 内部控件）