Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF DataTemplate property set at Content

New to WPF and have Tabs and in each tab the content is presented in a curved corner panel/window/whateveryouwannacallit. I wasn't sure how to do this ( Style, ControlTemplate ) but decided to go the DataTemplate way.

So now I have this DataTemplate:

<DataTemplate x:Key="TabContentPresenter" >
    <Border Margin="10"
            BorderBrush="{StaticResource DarkColorBrush}"
            CornerRadius="8"
            BorderThickness="2"
            Grid.Row="0"
            Padding="5" 
            Background="{TemplateBinding Background}">         

        <ContentPresenter Content="{Binding}" />

    </Border>
</DataTemplate>

As you can see with the the background property I wan't to set the background color at the content but Don't know how. Here I use it.

<Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="120"/>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <ContentControl ContentTemplate="{StaticResource TabContentPresenter}" Background="White">


                <!-- Something Here -->

            </ContentControl>

            <ContentControl ContentTemplate="{StaticResource TabContentPresenter}" Grid.Row="1" Background="Blue">

                <!-- Something Here -->

            </ContentControl>

        </Grid>

Is using DataTemplate wrong here or is there any other way?

I could probably set the background straight on the content and change from padding in mthe template to margin in the content but in some similiar situations that wouldn't work and it's nicer to only have to set it once.

EDIT:

As per advice I changed to ControlTemplate and also put it inside a style. This solves the Background problem but creates a bigger one. Now the content won't appear. I read on a blog here that putting a targetType solves this but it didn't solve my problem. The code looks like this now and also changed the ContentControl to use the style instead of Template.

<Style x:Key="TabContentPresenter" TargetType="ContentControl" >
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ContentControl">
                <Border Margin="10"
            BorderBrush="{StaticResource DarkColorBrush}"
            CornerRadius="8"
            BorderThickness="2"
            Grid.Row="0"
            Background="{TemplateBinding Background}">

                    <ContentPresenter Content="{Binding}" />

                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
like image 544
Ingó Vals Avatar asked Jun 25 '10 13:06

Ingó Vals


People also ask

What is difference between ItemTemplate and DataTemplate?

You use the ItemTemplate to specify the visualization of the data objects. If your ItemsControl is bound to a collection object and you do not provide specific display instructions using a DataTemplate, the resulting UI of each item is a string representation of each object in the underlying collection.

What is difference between a ControlTemplate and a DataTemplate in WPF?

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).

What's the difference between ContentControl and ContentPresenter?

ContentPresenter is used inside control templates to display content. ContentControl , when used directly (it's supposed to be used as a base class), has a control template that uses ContentPresenter to display it's content. My rules of thumb (not applicable in every case, use your judgment):

What is DataTemplate WPF?

DataTemplate is about the presentation of data and is one of the many features provided by the WPF styling and templating model. For an introduction of the WPF styling and templating model, such as how to use a Style to set properties on controls, see the Styling and Templating topic.


2 Answers

Use ControlTemplate instead DataTemplate

 <ControlTemplate  x:Key="TabContentPresenter">
        <Border Margin="10" 
                    CornerRadius="8" 
                    BorderThickness="2" 
                    Grid.Row="0" 
                    Padding="5"  
                    Background="{TemplateBinding Background}">
            <ContentPresenter Content="{Binding}"/>
        </Border>
    </ControlTemplate>

Use Template instead of ContentTemplate

<ContentControl  Background="Green" Template="{StaticResource  TabContentPresenter}"/>
like image 105
Ragunathan Avatar answered Sep 17 '22 05:09

Ragunathan


May be because TemplateBinding does not work with DataTemplate. Check this question for details.

Even if it works, all you need is a ControlTemplate and not a datatemplate.

like image 40
Amsakanna Avatar answered Sep 19 '22 05:09

Amsakanna