2017-03-07 57 views
1

我正在使用棱鏡RegionManager,在MainView內註冊不同視圖與TabControl區域。使用棱鏡關閉動態添加的選項卡項目 - WPF

MainView.xaml

<TabControl regions:RegionManager.RegionName="MainViewTabRegion"> 
     <TabControl.ItemTemplate> 
      <DataTemplate> 
       <DockPanel Width="Auto"> 
        <Button Command="{Binding DataContext.DataContext.CloseTabCommand, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" 
          CommandParameter="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" 
          Content="X" 
          Cursor="Hand" 
          DockPanel.Dock="Right" 
          Focusable="False" 
          FontFamily="Courier" 
          FontWeight="Bold" 
          Margin="4,0,0,0" 
          FontSize="10" 
          VerticalContentAlignment="Center" 
          Width="15" Height="15" /> 

          <ContentPresenter Content="{Binding DataContext.DataContext.HeaderText, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" /> 
       </DockPanel> 
      </DataTemplate> 
     </TabControl.ItemTemplate> 
    </TabControl> 

在MainViewViewModel我加入具有相同的基本類不同的看法。

MainViewViewModel.cs:

private void AddProjectView() { 
    var view = _container.Resolve<ProjectSettingsView>(); 
    var dataContext = _container.Resolve<ProjectSettingsViewModel>(); 
    dataContext.HeaderText = "test header txt"; 
    view.DataContext = dataContext; 
    _regionManager.RegisterViewWithRegion("MainViewTabRegion",() => view); 
} 

我可以用視圖中添加新的選項卡項目。

如何關閉標籤項,在上面的XAML代碼<TabControl.ItemTemplate>,在ProjectSettingsViewModel增加了一個關閉按鈕與CloseCommand,具有結合到它的TabItem。

ProjectSettingsViewModel.cs

private void OnExecuteCloseCommand(object tabItem) { 
    //Close this TabItem 
} 

回答

4

綁定ButtonTabItemDataContextCommandParameter屬性:

<Button Command="{Binding DataContext.DataContext.CloseTabCommand, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" 
          CommandParameter="{Binding Path=DataContext, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" 
          Content="X" 
          Cursor="Hand" 
          DockPanel.Dock="Right" 
          Focusable="False" 
          FontFamily="Courier" 
          FontWeight="Bold" 
          Margin="4,0,0,0" 
          FontSize="10" 
          VerticalContentAlignment="Center" 
          Width="15" Height="15" /> 

然後,您可以刪除這樣的觀點在視圖模型:

public class ProjectSettingsViewModel 
{ 
    private readonly IRegionManager _regionManager; 

    public ProjectSettingsViewModel(IRegionManager regionManager) 
    { 
     _regionManager = regionManager; 
     CloseTabCommand = new DelegateCommand<object>(OnExecuteCloseCommand); 
    } 

    private void OnExecuteCloseCommand(object tabItem) 
    { 
     _regionManager.Regions["MainViewTabRegion"].Remove(tabItem); 
    } 

    public DelegateCommand<object> CloseTabCommand { get; } 
} 
1

我在Pluralsight課程 「:掌握選項卡控件棱鏡問題&解決方案」 涵蓋這一點。你可以在這裏看到解決方案:https://app.pluralsight.com/library/courses/prism-mastering-tabcontrol/table-of-contents

本質上,你只需要創建一個TriggerAction,爲你做所有的工作。簡單。虛擬機中不需要任何東西。

+1

是否有沒有按一個鏈接是否需要註冊才能獲得解決方案?我認爲這個網站上沒有鏈接要求他註冊免費試用版。 –

+1

事實上,正如[此處](https://meta.stackoverflow.com/a/272885/7604843)所述,如果您鏈​​接到商業來源,它必須是對已經完整答案的補充,或者您應該提供與答案無關的材料。 –

+0

他想要一個免費的答案,他可以免費試用以獲得答案。如果他已經訂閱了,那更容易。答案就在那裏,如果申請審判太多而不能要求解決方案,那麼他可以在其他地方找到答案。 –

2

您只需要獲取對IRegionManager的引用。然後獲取視圖所屬的區域,然後調用區域上的Remove並傳遞tabItem引用以將其刪除。

例:

private void OnExecuteCloseCommand(object tabItem) { 
    regionManager.Regions["MainViewTabRegion"].Remove(tabItem); 
} 

實際上,你可以只把這個在您的MainViewViewModel並綁定到它在DataTemplate中,那麼你就不必改寫爲每個標籤項的視圖模型的關閉命令。