Question

I have a custom tab control, which displays a frame inside the TabItem, and a custom header. Setting the binding in ItemContainerStyle to display the TabItem works, but I can not get the binding in the DataTemplate to set the header text to work correctly. Note that the TabControl is bound to an ObservableCollection of items, which contain two properties – TI, the frame to display in the TabItem, and DisplayName, the string to display in the header.

===============XAML================

<TabControl Height="Auto" Name="mainTabControl" Width="Auto" IsSynchronizedWithCurrentItem="True" Margin="4" >
  <TabControl.ItemTemplate>
    <DataTemplate>
      <DockPanel Width="Auto">
        <Button 
            Content="X"
            Cursor="Hand"
            DockPanel.Dock="Right"
            Focusable="False"
            FontFamily="Courier" 
            FontSize="9"
            FontWeight="Bold"  
            Margin="0,1,0,0"
            Padding="0"
            VerticalContentAlignment="Bottom"
            Width="16" Height="16"               
            >
          <!-- Command=""      //Command binding TBD later
            CommandParameter="" -->
        </Button>
        <ContentPresenter 
            Content ="{Binding DisplayName}"
            VerticalAlignment="Center" 
            Margin="0,0,7,0"
          />
      </DockPanel>
    </DataTemplate>
  </TabControl.ItemTemplate>

  <TabControl.Style>
    <Style TargetType="TabControl">
      <Style.Triggers>
        <DataTrigger Binding="{Binding Items.Count, RelativeSource={RelativeSource Self}}"
                        Value="0">
          <Setter Property="Visibility" Value="Hidden" />
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </TabControl.Style>
  <TabControl.ItemContainerStyle  >
    <Style TargetType="TabItem">
      <Setter Property="Content" Value="{Binding TI}"/>
    </Style>
  </TabControl.ItemContainerStyle>
</TabControl>

============BOUND ITEM=============

  class TabItemContainer : Frame
  {
    public event DependencyPropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged(String info)
    {
      if (PropertyChanged != null)
      {
        PropertyChanged(this, new DependencyPropertyChangedEventArgs());
      }
    }

    private string displayname;

    public string DisplayName
    {
      get { return displayname; }
      set
      {
        if (value != this.displayname)
        {
          displayname = value;
          NotifyPropertyChanged("DisplayName");
        }
      }
    }

    public Frame TI { get; set; }
  }

===========CODE BEHIND=============

ObservableCollection<TabItemContainer> Tablist;

public MainWindow()
{
  InitializeComponent();

  Tablist = new ObservableCollection<TabItemContainer>();

  TabItemContainer tic = new TabItemContainer();
  tic.DataContext = tic;
  tic.DisplayName = "Untitled";
  tic.TI = new Frame();
  tic.TI.Navigate(new Page1());
  Tablist.Add(tic);
  mainTabControl.ItemsSource = Tablist;
  mainTabControl.SelectedIndex = Tablist.Count - 1;
}

Answer 1

Add a Header binding to your TabItem Style

<TabControl.ItemContainerStyle>
    <Style TargetType="TabItem">
        <Setter Property="Content" Value="{Binding TI}"/>
        <Setter Property="Header" Value="{Binding }" />
    </Style>
</TabControl.ItemContainerStyle>

The DataContext in your Header isn’t automatically getting set to your TabItemContainer (I thought it did…. must be mistaken)