views:

3555

answers:

1

I'm trying to build a WPF user interface containing a TabControl, and a TextBlock.

I want to bind these two controls to an underlying collection of instances of the following class:

class PageModel
{
  public string Title {get;set;}
  public string TabCaption {get;set;}
  public FrameworkElement TabContent {get;set}
}

The tab control should display a tab for each PageModel.

  • Each tab's header should display the TabCaption property
  • Each tab's content should be the TabContent property.

The TextBlock should display the Title of the currently selected tab.

How can I achieve this result?

+12  A: 
<TabControl x:Name="_tabControl" ItemsSource="{Binding PageModels}">
    <TabControl.ItemContainerStyle>
        <Style TargetType="TabItem">
            <Setter Property="Header" Value="{Binding TabCaption}"/>
            <Setter Property="Content" Value="{Binding TabContent}"/>
        </Style>
    </TabControl.ItemContainerStyle>
</TabControl>
<TextBlock Text="{Binding SelectedItem.Title, ElementName=_tabControl}"/>

HTH, Kent

Kent Boogaart
Thanks! I changed this slightly by replacing "{Binding PageModels}" with "{Binding}" and setting the DataContext equal to my collection of PageModels in the C#. This new copy of WPF Unleashed should help me understand how to make 'PageModels' work in that context.
mackenir
One problem though: I had previously replaced the TabControl and TabItem templates to change the look of the control, and this breaks that. The tab headers now draw in the standard style. Is there a way to combine this with my template modifications?
mackenir
I fixed this problem by using the BasedOn property on the style, to base it on the style I am using to modify the look of tabitems.
mackenir