Differenza tra modello di controllo e DataTemplate in WPF

Question

Che differenza c'è tra un ControlTemplate e un DataTemplate in WPF?

Answer 1

In genere un controllo viene reso per il proprio interesse e non riflette i dati sottostanti. Ad esempio, un Button non sarebbe associato a un oggetto business: è lì solo per poterlo fare clic. A ContentControl o ListBox, tuttavia, in genere vengono visualizzati in modo che possano presentare dati per l'utente.

A DataTemplate, pertanto, viene utilizzato per fornire una struttura visiva per i dati sottostanti, mentre un ControlTemplate non ha nulla a che fare con i dati sottostanti e fornisce semplicemente un layout visivo per il controllo stesso.

Un ControlTemplate saranno generalmente contenere solo TemplateBinding espressioni, vincolante nuovo alle proprietà sul controllo stesso, mentre un DataTemplate conterrà espressioni rilegatura standard, il legame con le proprietà della sua (l'oggetto di business/dominio o vista del modello) DataContext.

Answer 2

In pratica, un ControlTemplate descrive come visualizzare un controllo mentre un DataTemplate descrive come visualizzare i dati.

Ad esempio:

Un Label è un controllo e includerà una ControlTemplate che dice il Label dovrebbe essere visualizzato utilizzando un Border attorno ad alcuni contenuti (un DataTemplate o di un altro controllo).

Un Customer classe è dati e verrà visualizzato utilizzando un DataTemplate che potrebbe dire per visualizzare il tipo Customer come StackPanel contenente due TextBlocks uno che mostra il nome e l'altro che visualizza il numero di telefono. Potrebbe essere utile notare che tutte le classi sono visualizzate usando DataTemplates, di solito userai il modello predefinito che è un con la proprietà Text impostata sul risultato del metodo ToString dell'oggetto.

Answer 3

ControlTemplate - Modifica dell'aspetto dell'elemento. Ad esempio Button può contenere immagini e testo

DataTemplate - Rappresentare i dati sottostanti utilizzando gli elementi.

Answer 4

ControlTemplate: rappresenta lo stile di controllo.

DataTemplate: rappresenta lo stile di dati (come desideri visualizzare i dati).

Tutti i controlli utilizzano il modello di controllo predefinito che è possibile sovrascrivere tramite la proprietà del modello.

Per esempio
Button modello è un modello di controllo. Button contenuto del modello è un modello di dati

<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 Larsen ha una buona spiegazione sul 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 definisce l'aspetto visivo, DataTemplate sostituisce l'aspetto visivo di un elemento di dati.

Esempio: Voglio mostrare un pulsante da forma rettangolare a cerchio => Modello di controllo.

E se si dispone di oggetti complessi per il controllo, chiama e visualizza ToString(), con DataTemplate è possibile ottenere vari membri e visualizzare e modificare i loro valori dell'oggetto dati.