WPFのコントロールテンプレートとDataTemplateの違い

Question

WPFのControlTemplateとDataTemplateの違いは何ですか？

Answer 1

通常、コントロールは、それ自身のためにレンダリングされ、基礎となるデータを反映しません。たとえば、Buttonはビジネスオブジェクトにバインドされません。そのオブジェクトはクリックされています。しかし、ContentControlまたはListBoxは、一般に、ユーザーにデータを提示できるように表示されます。

DataTemplateは、基になるデータに視覚的な構造を提供するために使用され、ControlTemplateは基本データとは無関係であり、コントロール自体にビジュアルレイアウトを提供します。

ControlTemplateは一般のみDataTemplateがDataContext（ビジネス/ドメイン・オブジェクトまたはビュー・モデル）の特性に結合する、標準的な結合式を含むであろうが、バック・コントロール自体のプロパティに結合、TemplateBinding式を含むことになります。

Answer 2

非常に基本的にControlTemplateは、コントロールを表示する方法を説明し、DataTemplateは、データを表示する方法を説明しています。例えば

：

Labelはコントロールであり、Labelは一部のコンテンツの周りにBorder（DataTemplateまたは他のコントロール）を使用して表示されなければならないと言うControlTemplateを含むであろう。

Customer

クラスがデータであり、名前と他の表示電話番号を示す2 TextBlocksつを含むStackPanelとしてCustomerタイプを表示するように言うことができDataTemplateを用いて表示されます。すべてのクラスがDataTemplatesを使用して表示されていることに注意してください。TextBlockのデフォルトテンプレートを使用し、TextプロパティをオブジェクトのToStringメソッドの結果に設定します。

Answer 3

ControlTemplate - 要素の外観を変更します。例えば、Buttonは、画像とテキストを含むことができます。

DataTemplate - 要素を使用して基礎データを表します。

Answer 4

ControlTemplate：コントロールスタイルを表します。

DataTemplate：データスタイル（データの表示方法）を表します。

すべてのコントロールは、テンプレートプロパティでオーバーライドできるデフォルトのコントロールテンプレートを使用しています。

例えば
Buttonテンプレートは、コントロールテンプレートです。 ButtonコンテンツテンプレートDataTemplateは、データ項目の外観を置き換え、

<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"); 
    } 
} 

Answer 5

Troelsラーセンは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> 

Answer 6

ControlTemplate外観を定義する上で優れた説明を持つデータテンプレートです。

例：私は、長方形から円形の形=>コントロールテンプレートにボタンを表示したいです。

コントロールに複雑なオブジェクトがある場合は、ToString()を呼び出して表示し、DataTemplateと表示して、データオブジェクトの値を表示および変更できます。