DataTemplate和ControlTemplate联系与区别

---恢复内容开始---

正如标题中的两个拼接的单词所说,DataTemplate就是数据显示的模板,而ControlTemplate是控件自身的模板。(个人理解,错误请指出,谢谢)

我们看这二者在两类不同的控件中如何使用:

一:ItemsControl

  我们可以利用ControlTemplate来设置控件外表,用DataTemplate来填充控件内容。

<Page.Resources>
        <DataTemplate x:Key="dataTemplate">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition></ColumnDefinition>
                    <ColumnDefinition></ColumnDefinition>
                    <ColumnDefinition></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0"  Text="{Binding Name}"></TextBlock>
                <TextBlock Grid.Column="1"  Text="{Binding Age}"></TextBlock>
                <TextBlock Grid.Column="2"   Text="{Binding Sex}"></TextBlock>
            </Grid>
        </DataTemplate>
    </Page.Resources>
    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

        <ListBox x:Name="itemsControl" Width="300" Height="400" ItemsSource="{Binding Mode=OneWay}" ItemTemplate="{StaticResource dataTemplate}">
            <ListBox.Template>
                <ControlTemplate>
                    <Grid >
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"></RowDefinition>
                            <RowDefinition></RowDefinition>
                        </Grid.RowDefinitions>
                        <TextBlock Grid.Row="0" Grid.Column="0" FontSize="20" Text="姓名"></TextBlock>
                        <TextBlock Grid.Row="0" Grid.Column="1" FontSize="20" Text="年龄"></TextBlock>
                        <TextBlock Grid.Row="0" Grid.Column="2" FontSize="20" Text="性别"></TextBlock>
                        <ItemsPresenter   Grid.Row="1" Grid.ColumnSpan="3">

                        </ItemsPresenter>

                    </Grid>

                </ControlTemplate>
            </ListBox.Template>

        </ListBox>
        <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Height="56" Margin="102,157,0,0" VerticalAlignment="Top" Width="190" Click="button_Click"/>
    </Grid>

  对应的隐藏代码如下:

    public class Info
    {
        public string Name { get; set; } = "佚名";
        public int Age { get; set; } = 0;
        public string Sex { get; set; } = "不详";
    }
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

        }

        private void button_Click(object sender, RoutedEventArgs e)
        {
            List<Info> list = new List<Info>();
            list.Add(new Info());
            list.Add(new Info { Age = 15, Name = "小莉", Sex = "女" });
            list.Add(new Info { Age = 18, Name = "小桂子", Sex = "中" });

            itemsControl.ItemsSource = list;
        }
}

通过单击button,可以向列表控件中填充内容。

值得注意的是,列表表头在ControlTemplate中设置,而内标内容则是由DataTemplate通过数据绑定动态加载。

程序运行如下:

但是发现列表并没有按照表头的格式展开,这是因为ListBox中ListBoxItem中显示内容的宽度是自适应的。未来美观,我们作如下修改

设置ListBox的属性ItemContainerStyle如下:

<ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
               <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
                </Style>
</ListBox.ItemContainerStyle>

运行程序就发现如下显示了:

值得一提的是,我们在定义Info类的时候使用了C#6的新语法

public [类型] [变量名]{get;set;} = [初始化值];

好像跑题了。以上是ControlTemplate和DataTemplate在ItemsControl类型控件中的一个示例。而ContentControl类型控件中的用法也类似。唯一区别是在ContentTemplate中的ContentPresenter和ItemsPresenter之间。是哪种控件,就用哪种类型的Presenter。记住,设置了ContentTemplate,一定要设置ContentPresenter或ItemsPresenter,否则数

据不显示。

来点官方的

public sealed class ControlTemplate : Windows.UI.Xaml.FrameworkTemplate

public class DataTemplate : Windows.UI.Xaml.FrameworkTemplate

public class FrameworkTemplate : Windows.UI.Xaml.DependencyObject
    Windows.UI.Xaml 的成员

摘要:
创建元素的元素树。FrameworkTemplate 是那些具有特定模板化行为(包括 ControlTemplate 和 DataTemplate)的类的基类。

通过上面的,你应该已经看出他们的共同点了。

至于核心的,在深入的。我也就不懂了。。该请教周家安,林政这些.net界的大牛了。向前辈致敬!

时间: 2024-10-16 11:34:24

DataTemplate和ControlTemplate联系与区别的相关文章

WPF Template模版之DataTemplate与ControlTemplate【一】

WPF Template模版之DataTemplate与ControlTemplate[一] 标签: Wpf模版 2015-04-19 11:52 510人阅读 评论(0) 收藏 举报  分类: -------1.5 .NET(25)  版权声明:本文为博主郎涯工作室原创文章,未经博主允许不得转载. 目录(?)[+] WPF系统不但支持传统的Winfrom编程的用户界面和用户体验设计,更支持使用专门的设计工具Blend进行专业设计,同时还推出了以模板为核心的新一代设计理念. 1. 模板的内涵 作

WPF Template模版之DataTemplate与ControlTemplate的关系和应用【二】

1. DataTemplate和ControlTemplate的关系 学习过DataTemplate和ControlTemplate,你应该已经体会到,控件只是数据的行为和载体,是个抽象的概念,至于它本身长成什么样子(控件内部结构),它的数据会长成什么样子(数据显示结构)都是靠Template生成的.决定控件外观的是ControlTemplate,决定数据外观的是DataTemplate,它们正是Control类的Template和ContentTemplate两个属性值 凡是Template,

DataTemplate和ControlTemplate的关系

在wp/silverlight/wpf也会经常看到控件模板.经常混淆的应该是DataTemplate和ControlTemplate,本篇文章就来谈谈两件衣服DataTemplate和ControlTemplate的关系.本篇文章主要会以wpf控件为主,以便最后的源码大家都可以打开. 一.ContentControl中的DataTemplate 在开始之前,我们先去看一下ContentControl的定义,无论在wp还是在wpf中其都有下面两个属性: public object Content

[UWP]如何使用代码创建DataTemplate(或者ControlTemplate)

原文:[UWP]如何使用代码创建DataTemplate(或者ControlTemplate) 1. 前言 在UWP中DataTemplate是一个十分重要的功能,并且几乎无处不在,例如DataGrid中的DataGridTemplateColumn: <controls:DataGridTemplateColumn.CellTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" Vert

XAML中ContentControl,ItemsControl,DataTemplate之间的联系和区别

接触XAML很久了,但一直没有深入学习.今天学习了如标题所示的内容,所以来和大家分享一下,或者准确的说是自我回顾一遍. 在XAML中,有两类我们常见的控件,分别是ContentControl和ItemsControl,典型的标识是一个有Content属性,另一个有Items属性. 一:ContentControl 我们平时最常见的该类型控件有Button,RadioButton,CheckBox等.一般有Content属性的都是这类控件.在该类控件中,有一个属性便是ContentTemplate

[uwp开发]数据绑定那些事(2)

接着上一篇来侃. 二.实体到控件之间的绑定 这儿不知道用实体这个词恰不恰当,凑活着理解就行了.他可以是一个类实例,也可以是一个集合. 所以,相应的我们就引入两个Demo,第一个介绍用简单的类作为作为数据源,第二个就介绍用一个集合作为数据源 废话不多说,来看demo,我先上代码,后上分析 DEMO1: XAML页面 <Page.Resources> <local:User x:Key="user"></local:User> </Page.Res

ControlTemplate,ItemsPanelTemplate,DataTemplate(wpf)

在WPF中有三大模板ControlTemplate,ItemsPanelTemplate,DataTemplate.其中ControlTemplate和ItemsPanelTemplate是控件模板,DataTemplate是数据模板,他们都派生自FrameworkTemplate抽象类. 1.ControlTemplate ControlTemplate:控件模板主要有两个重要属性:VisualTree内容属性和Triggers触发器.所谓VisualTree(视觉树),就是呈现我们所画的控件

[转]MVVM架构~mvc,mvp,mvvm大话开篇

MVP 是从经典的模式MVC演变而来,它们的基本思想有相通的地方:Controller/Presenter负责逻辑的处理,Model提供数据,View负 责显示.作为一种新的模式,MVP与MVC有着一个重大的区别:在MVP中View并不直接使用Model,它们之间的通信是通过Presenter (MVC中的Controller)来进行的,所有的交互都发生在Presenter内部,而在MVC中View会从直接Model中读取数据而不是通过 Controller. 在MVC里,View是可以直接访问

【框架篇】mvc、mvp、mvvm使用关系总结

MVC MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑.数据.界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑.MVC被独特的发展起来用于映射传统的输入.处理和输出功能在一个逻辑的图形化用户界面的结构中. 数据关系 View 接受用户交互请求 View 将请求转交给Controller Controller