Creating dynamic TabItem in WPF.

Hi,

We recently had a requirement in our project to create dynamic TabItems

something similar to below screen shot.

Here every time when we click on Add View One and Add View Two buttons a new TabItem gets added to the tab control on the right side showing its respective views.

The project structure is like this

Two views, ViewTypeOne and ViewTypeTwo with a simple textblock in them.

Two ViewModel for those views, one for the main window and the fourth one VMParentForView which is the parent of our other two view models.

VMParentForView class

The TabControl in the main window is bind to the ObservableCollection of VMParentForViews viewmodel and the Textblock to the Header property of Views.


<TabControl Height=”271″ HorizontalAlignment=”Left” Margin=”123,9,0,0″ Name=”mainTabControl” VerticalAlignment=”Top” Width=”441″ 
IsSynchronizedWithCurrentItem=”True” ItemsSource=”{Binding ObservableCollectionTabItems}” Background=”White”>

<TabControl.ItemTemplate>

<DataTemplate>

<TextBlock Text=”{Binding Header}” ></TextBlock>

</DataTemplate>

</TabControl.ItemTemplate>

</TabControl>

Here is the sample code of the demo application.

https://skydrive.live.com/redir.aspx?cid=2312e1103cbe5ecd&resid=2312E1103CBE5ECD!337&parid=root

Hope it helps.


Author: Nishant Rana

I love working in and sharing everything about Microsoft.NET technology !

1 thought on “Creating dynamic TabItem in WPF.”

Share your thoughts

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s