WPF DataTemplate与ControlTemplate知识积攒

WPF DataTemplate与ControlTemplate

Answer One

Typically a control is rendered for its own sake, and doesn’t reflect underlying data. For example, a Button wouldn’t be bound to a business object - it’s there purely so it can be clicked on. A ContentControl or ListBox, however, generally appear so that they can present data for the user.

A DataTemplate, therefore, is used to provide visual structure for underlying data, while a ControlTemplate has nothing to do with underlying data and simply provides visual layout for the control itself.

A ControlTemplate will generally only contain TemplateBinding expressions, binding back to the properties on the control itself, while a DataTemplate will contain standard Binding expressions, binding to the properties of its DataContext (the business/domain object or view model).

Answer Two

Very basically a ControlTemplate describes how to display a Control while a DataTemplate describes how to display Data.

For example:

A Label is a control and will include a ControlTemplate which says the Label should be displayed using a Border around some Content (a DataTemplate or another Control).

A Customer class is Data and will be displayed using a DataTemplate which could say to display the Customer type as a StackPanel containing two TextBlocks one showing the Name and the other displaying the phone number. It might be helpful to note that all classes are displayed using DataTemplates, you will just usually use the default template which is a TextBlock with the Text property set to the result of the Object’s ToString method.

Answer Three

ControlTemplate: Represents control style.

DataTemplate: Represents data style(How would you like to show your data).

All controls are using default control template that you can override through template property.

For example
Button template is a control template. Button content template is a data template

<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 Four

ControlTemplate - Changing the appearance of element. For example Button can contain image and text

DataTemplate - Representing the underlying data using the elements.

Answer Five

ControlTemplate DEFINES the visual appearance, DataTemplate REPLACES the visual appearance of a data item.

Example: I want to show a button from rectangular to circle form => Control Template.

And if you have complex objects to the control, it just calls and shows ToString(), with DataTemplate you can get various members and display and change their values of the data object.

Answer Six

All of the above answers are great but there is a key difference that was missed. That helps make better decisions about when to use what. It is ItemTemplate property:

• DataTemplate is used for elements that provide ItemTemplate property for you to replace its items’ content using DataTemplates you define previously according to bound data through a selector that you provide.
• But if your control does not provide this luxury for you then you still can use a ContentView that can display its content from predefined ControlTemplate. Interestingly, you can change the ControlTemplate property of your ContentView at runtime. One more thing to note that unlike controls with ItemTemplate property, you cannot have a TemplateSelector for this (ContentView) control. However, you still can create triggers to change the ControlTemplate at runtime.