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 11:46am
akak6522
Edited 23-Dec-12 12:02pm
v2

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

  Print Answers RSS
0 OriginalGriff 371
1 Sergey Alexandrovich Kryukov 269
2 CB Sharma 79
3 RyanDev 75
4 PhilLenoir 70
0 Sergey Alexandrovich Kryukov 6,676
1 OriginalGriff 6,056
2 CPallini 2,473
3 Richard MacCutchan 1,697
4 Abhinav S 1,560


Advertise | Privacy | Mobile
Web04 | 2.8.140821.2 | 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