Display dynamic number in WPI TabItem header

Question

I have a TabControl where each element contains a user control called Timeline. This "timeline" has the "Number" property, which changes at run time.

I want the "Number" property to appear in the TabItem header. And I really don't know how to do this, to be honest.

My first thought is that I have to create a user control that comes from the original TabItem control and creates a DependencyProperty or something using a special ControlTemplate.

I feel like I’m pretty bad at explaining this ...

Example: I want to make something like the third image in the message at the following URL, but instead of the close button, I want to display the Number property, which dynamically changes at runtime!

http://geekswithblogs.net/kobush/archive/2007/04/08/closeabletabitem.aspx

Answer 1

If we have this class:

public class MyItem : INotifyPropertyChanged
{
    public string Title {get; set;}

    private int number;
    public int Number
    {
        get { return number; }
        set
        {
             number= value;
             OnPropertyChanged("Number");
        }
    }
}

We can bind a collection of elements to a TabControl:

<TabControl ItemsSource="{Binding MyItems}">            
    <TabControl.ItemTemplate>
        <DataTemplate>                    
            <StackPanel Orientation="Horizontal">                            
                <TextBlock Text="{Binding Title}"/>
                <TextBlock Text="{Binding Number}"/>
            </StackPanel>                        
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <my:TimeLine Number="{Binding Number, Mode=TwoWay}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>