WPF DataTemplate property set at Content

Question

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>

Ailey

Answer 1

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}"/>

Decapitate

This works with the background but now my Content doesn't appear inside the border. – Mccall

Figured it out finally, had to change the ContentPresenter Content property to {TemplateBinding Content} . – Mccall

Answer 2

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.

Bishop

Thank you, I did indeed know that TemplateBinding didn't work I put it in there to show what I wanted. I don't really know the difference between DataTemplate and ControlTemplate so I never know wich one to use. – Mccall

First link is broken. – Magneton