Why does my databound TabControl not look like my non-databound TabControl?

Answer 1

Hi Edward,

What I think is happening here, is that the entire DataTemplate is set to the Header of the TabItem. Have a look at this link, it gives an example for both a Header and a ContentTemplate for the TabControl: http://psiman.wordpress.com/2006/12/07/databound-master-detail-tabcontrol/

Answer 2

TabControl uses two different templates to define its structure. ItemTemplate is for the headers (the "tabs"), and ContentTemplate is for the content displayed under each tab.

This XAML looks more like your first screenshot:

<Window.Resources>
    <DataTemplate x:Key="TabHeaderTemplate">
        <TextBlock Text="{Binding Title}"/>
    </DataTemplate>

    <DataTemplate x:Key="TabItemTemplate">
        <TextBlock Text="{Binding Description}" Margin="10"/>
    </DataTemplate>
</Window.Resources>

<TabControl Width="225" Height="150" 
            ItemsSource="{Binding AreaNames}"            
            ContentTemplate="{StaticResource TabItemTemplate}"         
            ItemTemplate="{StaticResource TabHeaderTemplate}" />