綁定TabControl ItemsSource到ViewModels的集合

由於某些原因，我在將ItemsSource綁定到ObservableCollection視圖模型時讓我的TabControl正確顯示。我正在根據這裏找到的教程設計我的設計：http://msdn.microsoft.com/en-us/magazine/dd419663.aspx。我確實在這裏找到了像我這樣的幾個問題，但沒有提到我的特殊情況。這是我在xaml中的TabControl。綁定TabControl ItemsSource到ViewModels的集合

<TabControl ItemsSource="{Binding Workspaces}" 
      SelectedIndex="{Binding ActiveWorkspaceIndex}" 
      ItemTemplate="{StaticResource ClosableTabItemTemplate}"/>

其中ClosableTabItemTemplate是以下內容。

<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是視圖模型的ObservableCollection。 ActiveWorkspaceIndex只是我在視圖模型中跟蹤的活動工作空間索引。我通過我的App.xaml文件中的以下數據模板將視圖模型與視圖實例相關聯。

<DataTemplate DataType="{x:Type vm:ViewModelStartPage}"> 
    <v:ViewStartPage/> 
</DataTemplate>

我只將一個視圖模型添加到我的工作區集合中。我看到2個視圖顯示在選項卡控件中，並且它們不是選項卡。這幾乎就像TabControl不知道將不同視圖視爲TabItems，它的行爲更像一個堆棧面板，堆疊視圖。如果我在代碼中創建選項卡，它可以正常工作，如下所示：

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);

我必須缺少一些內容模板或其他東西。我將在後期對標籤進行樣式設計，但現在我很樂意讓基本標籤工作。此外，選項卡內容中的視圖可能會因每個選項卡而不同，因此我無法使用簡單的文本塊TabControl模板示例，我在各處看到... 即，不是這個...

<TabControl.ContentTemplate> 
    <DataTemplate> 
     <TextBlock 
      Text="{Binding Content}" /> 
    </DataTemplate>

任何想法？

來源

2012-12-23 akagixxer

我在一個測試項目中試過了你的代碼，並且TabControl按照預期在這裏工作。你可以發佈「堆疊」TabControl的圖像嗎？ – Sphinxxx

謝謝你試試看。我最終使用帶有TabControl數據模板的ContentControl。這似乎解決了一些問題。老實說，我沒有足夠的經驗來解釋爲什麼這改變了事情，但現在它正在工作。我會發布我的工作代碼。 – akagixxer

我結束了使用ContentControl與TabControl數據模板（如原始教程項目）。這是我結束的xaml代碼。我沒有更改原始示例項目中的代碼隱藏來完成此項工作。 ContentControl位於我的MainWindow.xaml中，另外兩個代碼位於ResourceDictionary。

<!-- Workspaces Tab Control --> 
     <ContentControl Grid.Row="1" 
         VerticalAlignment="Stretch" 
         HorizontalAlignment="Stretch" 
         Content="{Binding Path=Workspaces}" 
         ContentTemplate="{StaticResource WorkspacesTemplate}"/> 

<!-- Workspaces Template --> 
    <DataTemplate x:Key="WorkspacesTemplate"> 
    <TabControl Style="{StaticResource ClosableTabControl}" 
       IsSynchronizedWithCurrentItem="True" 
       ItemsSource="{Binding}" 
       ItemTemplate="{StaticResource WorkspaceTabItemTemplate}" 
       Margin="1"/> 
    </DataTemplate> 


<!-- Workspace Tab Item Template --> 
    <DataTemplate x:Key="WorkspaceTabItemTemplate"> 
    <Grid Width="Auto" Height="Auto"> 
     <ContentPresenter ContentSource="Header" Margin="3" 
         Content="{Binding Path=DisplayName}" 
         HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <ContentPresenter.Resources> 
      <Style TargetType="TextBlock"> 
      <Setter Property="Foreground" Value="{StaticResource Foreground}"/> 
      </Style> 
     </ContentPresenter.Resources> 
     </ContentPresenter> 
    </Grid> 
    </DataTemplate>

來源

2012-12-30 20:55:35 akagixxer

綁定TabControl ItemsSource到ViewModels的集合

回答

相關問題