Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
For some reason I am having a heck of a time getting my TabControl to display properly when binding the ItemsSource to a ObservableCollection of view models. I'm basing my design off of the tutorial found here: http://msdn.microsoft.com/en-us/magazine/dd419663.aspx. I did find a few questions like mine here but none addressed my particular situation. This is my TabControl in xaml.
 
<TabControl ItemsSource="{Binding Workspaces}"
            SelectedIndex="{Binding ActiveWorkspaceIndex}"
            ItemTemplate="{StaticResource ClosableTabItemTemplate}"/>
 
Where ClosableTabItemTemplate is the following.
 
<DataTemplate x:Key="ClosableTabItemTemplate">
        <DockPanel Width="120">
          <Button 
              Command="{Binding Path=CloseCommand}"
              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" 
              />
          <ContentPresenter 
              Content="{Binding Path=DisplayName}" 
              VerticalAlignment="Center" 
              />
        </DockPanel>
      </DataTemplate>
 
Workspaces is the ObservableCollection of view models. ActiveWorkspaceIndex is just the active workspace index that I keep track of in the view model. I associate my view model with an instance of a view through the following data template in my App.xaml file.
 
<DataTemplate DataType="{x:Type vm:ViewModelStartPage}">
     <v:ViewStartPage/>
 </DataTemplate>
 
I only add one view model to my collection of workspaces. I see 2 views display in the tab control and they aren't tabbed. It's almost like the TabControl doesnt know to treat the different views as TabItems, its behaving more like a stack panel, stacking the views. If I create the tab items in code it works fine like this:
 
System.Windows.Controls.TabItem i = new System.Windows.Controls.TabItem();
i.Content = new Views.ViewStartPage();
i.Header = "A Tab Item";
this.xTabControl.Items.Add(i); 
 
The C# code above is what I want to accomplish through binding the view models.
 
I must be missing some content template or something. I will be styling my tabs later but for now I would be happy just getting the basic tabs working. Also the views in the tab contents may be different for each tab so I can't use the simple textblock TabControl template examples I see all over the place... I.e. not this...
 
<TabControl.ContentTemplate>
    <DataTemplate>
        <TextBlock
           Text="{Binding Content}" />
    </DataTemplate>
 
Any ideas?
Posted 23-Dec-12 12:46pm
akak6574
Edited 23-Dec-12 13:02pm
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



Advertise | Privacy | Mobile
Web03 | 2.8.1411023.1 | Last Updated 23 Dec 2012
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100