备注:类关系结构图如下:
模板(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 自己按照逻辑树寻找就好。
- DataTemplate 常用的地方有三处,分别是
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 内部控件)