以編程方式將新的Datagrid（或其他UserControll）添加到以編程方式生成的TabItem（使用mvvm）

我有一個包含2個選項卡（選項卡A和選項卡B）的TabControl的XAML代碼。在選項卡A中，我可以爲選項卡B進行配置，因此選項卡B可以根據選項卡A進行動態更改。選項卡B包含一個沒有實現任何選項卡的靜態選項卡控件（因爲選項卡稍後會生成）。注意：「標籤A」和「標籤B」是主標籤，「標籤C」，「標籤D」等等是「標籤B」中的子標籤。以編程方式將新的Datagrid（或其他UserControll）添加到以編程方式生成的TabItem（使用mvvm）

這是我的XAML代碼：

<TabItem Header="TAB_B"> 
      <Grid> 
       <TabControl ItemsSource="{Binding MyTabItems, UpdateSourceTrigger=PropertyChanged}"> 
         <TabControl.ItemTemplate> 
          <DataTemplate> 
           <!-- here I want to show a Datagrid for each new Tab ("Tab C", "Tab D", ...) --> 
          </DataTemplate>        
         </TabControl.ItemTemplate> 
       </TabControl> 
      </Grid> 
     </TabItem>

在我的ViewModel我有綁定屬性：

private ObservableCollection<TabItem> _myTabItems; 
    public ObservableCollection<TabItem> MyTabItems 
    { 
     get { return _myTabItems; } 
     set 
     { 
      _myTabItems = value; 
      OnPropertyChanged("MyTabItems"); 
     } 
    }

在我的ViewModel一個具有建立我的選項卡項目在TabController在選項卡的方法B：

public void BuildContentOfTabB() 
    { 
     foreach (var item in myTabList) 
     { 
       MyTab = new TabItem(); 
       MyTab.Header = myHeaderString; // e.g. "Tab C", "Tab D" 
       MyTabItems.Add(MyTab); 
      } 
     } 
    }

這很好。我在我的TabController中得到了新的TabItems（「Tab C」，「Tab D」，...）。現在我想在「選項卡C」或「選項卡D」中獲得像Datagrid這樣的新用戶控件。我不知道如何解決我的問題。謝謝你的回答。

來源

2017-08-04 Fardey

組''到你的'TabControl'。 'MyTabItems'應該是'ObservableCollection ' – rmbq

如果你的「viewmodel」包含任何特定的視圖（比如'TabItem'），那麼這不是MVVM。在MVVM中，VM層不直接耦合到特定的視圖技術。 – grek40

@ grek40：但我該如何解決這個問題，以免損壞我的MVVM模式？ – Fardey

創建一個基類爲您的ViewModels：

public abstract class BaseVM {}

不是修改你的MyTabItem屬性：

public ObservableCollection<BaseVM> MyTabItems...

創建自定義的ViewModels繼承BaseVM（public class DatagridVM:BaseVM）
您的TabControl的是：

<TabControl ItemsSource="{Binding MyTabItems}"> 
      <TabControl.ContentTemplate> 
       <DataTemplate> 
        <ContentControl Content="{Binding}"/> 
       </DataTemplate> 
      </TabControl.ContentTemplate> 
</TabControl>

在ResourceDictionary中定義的ViewModels的視圖：

<DataTemplate DataType="{x:Type vm:DatagridVM}"> 
    <Datagrid/> 
</DataTemplate>

來源

2017-08-04 11:40:43 rmbq

以編程方式將新的Datagrid（或其他UserControll）添加到以編程方式生成的TabItem（使用mvvm）

回答

相關問題