當選定的功能區選項卡項更改時更改視圖

我在MVVM應用程序中使用Fluent功能區。對於每個選項卡項目，我都關聯一個視圖和一個視圖模型（設置一個新的DataContext）。每當選擇的選項卡項目更改時，如何更改視圖和視圖模型（DataContext）？如果每次選擇標籤項目時都會觸發一個事件，例如Microsoft的WPF所提供的功能區，那就太好了。此外，爲所選功能區實例定義的SelectedTabChanged事件在更改選定選項卡時會觸發兩次：一次用於舊選項卡，一次用於新選項卡項目。我認爲這不是一個好的編碼習慣。當選定的功能區選項卡項更改時更改視圖

無論如何，請在更改選定選項卡項目時更改視圖的有效方法（代碼示例或指向一些代碼示例的鏈接）。

感謝，

鐸

來源

2010-08-13 Tudor Cret

我看到這是一個老問題，但在谷歌上搜索了同樣的事情，我在此絆倒了。也許其他人可以在未來找到這個有用的答案。至少有一種相當可接受的方法來解決這個問題，這也很簡單：通過綁定和使用容器TabControl爲每個視圖關聯到每個功能區選項卡。

將一個色帶和一個TabControl堆疊在一起。
將選項卡控件的SelectedIndex屬性綁定到功能區的SelectedTabIndex。
隱藏選項卡控件中所有選項卡項的標題。

代碼：

<fluent:RibbonWindow 
    x:Class="FluentExample.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:fluent="clr-namespace:Fluent;assembly=Fluent" 
    > 
    <DockPanel LastChildFill="True"> 
     <fluent:Ribbon x:Name="_ribbon" DockPanel.Dock="Top"> 
      <!-- Ribbon tabs --> 
      <fluent:RibbonTabItem Header="Tab #1" /> 
      <fluent:RibbonTabItem Header="Tab #2" /> 
     </fluent:Ribbon> 

     <!-- Views container --> 
     <TabControl 
      DockPanel.Dock="Bottom" 
      SelectedIndex="{Binding ElementName=_ribbon, Path=SelectedTabIndex}" 
      > 

      <!-- Hide tab items headers --> 
      <TabControl.ItemContainerStyle> 
       <Style TargetType="{x:Type TabItem}"> 
        <Setter Property="Visibility" Value="Collapsed"/> 
       </Style> 
      </TabControl.ItemContainerStyle> 

      <!-- Individual content for each tab go here --> 
      <TabItem><TextBlock Text="First Content View (#1)" /></TabItem> 
      <TabItem><TextBlock Text="Second Content View (#2)" /></TabItem> 
     </TabControl> 
    </DockPanel> 
</fluent:RibbonWindow>

來源

2014-03-26 18:45:23 Leandro

當選定的功能區選項卡項更改時更改視圖

回答

相關問題