WPF中Control Template和DataTemplate的区别

Posted

技术标签:

【中文标题】WPF中Control Template和DataTemplate的区别【英文标题】:Difference between Control Template and DataTemplate in WPF 【发布时间】:2010-11-23 07:55:59 【问题描述】:

WPF 中的ControlTemplateDataTemplate 有什么区别?

【问题讨论】:

【参考方案1】:

以上所有答案都很棒,但遗漏了一个关键区别。这有助于更好地决定何时使用什么。是ItemTemplate属性:

DataTemplate 用于提供 ItemTemplate 属性的元素,以便您使用您之前通过您提供的选择器根据绑定数据定义的 DataTemplates 替换其项目的内容。

但是如果您的控件不能为您提供这种奢侈,那么您仍然可以使用ContentView,它可以显示来自预定义ControlTemplate 的内容。有趣的是,您可以在运行时更改ContentViewControlTemplate 属性。还有一点需要注意,与具有ItemTemplate 属性的控件不同,您不能为此(ContentView)控件拥有TemplateSelector。但是,您仍然可以创建触发器以在运行时更改 ControlTemplate

【讨论】:

【参考方案2】:

Troels Larsen对MSDN forum有很好的解释

<Window x:Class="WpfApplication7.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
  <Window.Resources>
    <DataTemplate x:Key="ButtonContentTemplate">
      <StackPanel Orientation="Horizontal">
        <Grid Height="8" Width="8">
          <Path HorizontalAlignment="Stretch" 
           Margin="0,0,1.8,1.8" 
           VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
           Data="M0.5,5.7 L0.5,0.5 L5.7,0.5"/>
          <Path HorizontalAlignment="Stretch" 
           Margin="2,3,0,0" 
           VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
           Data="M3.2,7.5 L7.5,7.5 L7.5,3.5"/>
          <Path HorizontalAlignment="Stretch" 
           Margin="1.2,1.4,0.7,0.7" 
           VerticalAlignment="Stretch" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" 
           Data="M2.5,2.5 L7.5,7.5"/>
          <Path HorizontalAlignment="Stretch" 
           Margin="1.7,2.0,1,1" 
           VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
           Data="M3,7.5 L7.5,7.5 L7.5,3.5"/>
          <Path HorizontalAlignment="Stretch" 
           Margin="1,1,1,1" 
           VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
           Data="M1.5,6.5 L1.5,1 L6.5,1.5"/>
        </Grid>
        <ContentPresenter Content="Binding"/>
      </StackPanel>
    </DataTemplate>
    <ControlTemplate TargetType="Button" x:Key="ButtonControlTemplate">
      <Grid>
        <Ellipse Fill="TemplateBinding Background"/>
        <ContentPresenter HorizontalAlignment="Center"
              VerticalAlignment="Center"/>
      </Grid>
    </ControlTemplate>
  </Window.Resources>
  <StackPanel>
    <Button Template="StaticResource ButtonControlTemplate" ContentTemplate="StaticResource ButtonContentTemplate" Content="1"/>
    <Button Template="StaticResource ButtonControlTemplate" ContentTemplate="StaticResource ButtonContentTemplate" Content="2"/>
    <Button Template="StaticResource ButtonControlTemplate" ContentTemplate="StaticResource ButtonContentTemplate" Content="3"/>
  </StackPanel>
</Window>

(模板公然从 http://msdn.microsoft.com/en-us/library/system.windows.controls.controltemplate.aspx 和 http://msdn.microsoft.com/en-us/library/system.windows.controls.contentcontrol.contenttemplate%28VS.95%29.aspx 分别)

无论如何,ControlTemplate 决定了 Button 本身的外观,而 ContentTemplate 决定按钮内容的外观。所以 您可以将内容绑定到其中一个数据类并拥有它 随心所欲地展示自己。

【讨论】:

【参考方案3】:

ControlTemplate 定义视觉外观,DataTemplate 替换数据项的视觉外观。

示例:我想显示一个从矩形到圆形的按钮 => 控制模板。

如果控件有复杂的对象,它只会调用并显示ToString(),使用DataTemplate,你可以获取各种成员并显示和更改数据对象的值。

【讨论】:

【参考方案4】:

ControlTemplate:表示控件样式。

DataTemplate:表示数据样式(您希望如何显示您的数据)。

所有控件都使用默认控件模板,您可以通过模板属性覆盖该模板。

例如Button模板是一个控件模板。 Button 内容模板是数据模板

<Button   VerticalAlignment="Top" >
    <Button.Template>
        <ControlTemplate >
            <Grid>
                <Rectangle Fill="Blue" RadiusX="20" RadiusY="20"/>
                <Ellipse Fill="Red" />
                <ContentPresenter Content="Binding">
                    <ContentPresenter.ContentTemplate>
                        <DataTemplate>
                        <StackPanel Orientation="Horizontal" Height="50">
                            <TextBlock Text="Name" Margin="5"/>
                                <TextBox Text="Binding UserName, Mode=TwoWay" Margin="5" Width="100"/>
                            <Button Content="Show Name" Click="OnClickShowName" />
                        </StackPanel>
                    </DataTemplate>
                    </ContentPresenter.ContentTemplate>
                </ContentPresenter>
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

public String UserName

    get  return userName; 
    set
    
        userName = value;
        this.NotifyPropertyChanged("UserName");
    

【讨论】:

【参考方案5】:

ControlTemplate - 改变元素的外观。例如Button可以包含图片和文字

DataTemplate - 使用元素表示基础数据。

【讨论】:

【参考方案6】:

基本上ControlTemplate 描述了如何显示控件,而DataTemplate 描述了如何显示数据。

例如:

Label 是一个控件,将包含一个ControlTemplate,它表示应该在某些内容(DataTemplate 或另一个控件)周围使用Border 显示Label

Customer 类是 Data,将使用 DataTemplate 显示,这可以说将 Customer 类型显示为 StackPanel,其中包含两个 TextBlocks,一个显示名称,另一个显示电话号码.注意所有类都使用DataTemplates 显示可能会有所帮助,您通常只使用默认模板,即TextBlock,并将Text 属性设置为对象的ToString 方法的结果。

【讨论】:

投票赞成描述的简单性。非常感谢。【参考方案7】:

通常,控件是为了自身而呈现的,并不反映底层数据。例如,Button 不会绑定到业务对象 - 它纯粹是为了让您可以点击它。但是,ContentControlListBox 通常会出现,以便它们可以为用户呈现数据。

因此,DataTemplate 用于为底层数据提供可视化结构,而 ControlTemplate 与底层数据无关,只是为控件本身提供可视化布局。

ControlTemplate 通常只包含TemplateBinding 表达式,绑定回控件本身的属性,而DataTemplate 将包含标准绑定表达式,绑定到其DataContext 的属性(业务/域对象或视图模型)。

【讨论】:

这有意义吗?我想我是在尝试解释哲学上的差异,而不是技术上的差异。

以上是关于WPF中Control Template和DataTemplate的区别的主要内容,如果未能解决你的问题,请参考以下文章

WPF的ControlTemplate和DataTemplate简介

WPF CheckBox 样式

WPF CheckBox

WPF中CAD control的XAML实现

Wpf基础入门——控件Control篇

WPF -- DataTemplate与ControlTemplate结合使用