MVVM TabControlItemsへのビューのバインド - ビューが表示されない

Question

私のメインビュー内に異なるビューをTabControlItemsに表示したい。

public sealed class TabItem 
{ 
    public string Header { get; set; } 
    public ViewModelBase Content { get; set; } 
} 

私は私のViewModelでListに呼び出す：私のビューに表示され、その後EDIT

private ObservableCollection<TabItem> _views; 
public ObservableCollection<TabItem> Views 
{ 
    get { return _views; } 
    set 
    { 
     _views = value; 
     RaisePropertyChanged(() => Views); 
    } 
} 

public IndexMainViewModel() 
{ 
    Views = new ObservableCollection<TabItem>(); 
    Views.Add(new TabItem { Header = "Export", Content = new ExportViewModel() }); 
    Views.Add(new TabItem { Header = "Import", Content = new ImportViewModel() }); 
} 

そして：私はこのようなクラスを作成しました。これを行うために

<window xmlns:views="clr-namespace:EDICOT_Module_Import_Export_Articles.View" 
xmlns:vm="clr-namespace:EDICOT_Module_Import_Export_Articles.ViewModel" 
xmlns:model="clr-namespace:EDICOT_Module_Import_Export_Articles.Model.Classes" 
DataContext="{Binding IndexMainVM, Source={StaticResource Locator}}"> 

    <TabControl ItemsSource="{Binding Views}"> 
    <TabControl.Resources> 
     <DataTemplate DataType="{x:Type model:TabItem}"> 
      <DataTemplate.Resources> 
       <DataTemplate DataType="{x:Type vm:ImportViewModel}"> 
        <views:ImportView /> 
       </DataTemplate> 
       <DataTemplate DataType="{x:Type vm:ExportViewModel}"> 
        <views:ExportView /> 
       </DataTemplate> 
      </DataTemplate.Resources> 
      <ContentControl Content="{Binding Content}"/> 
     </DataTemplate> 
    </TabControl.Resources> 

    <TabControl.ItemTemplate > 
     <DataTemplate > 
      <TextBlock Text="{Binding Header}"/> 
     </DataTemplate> 
    </TabControl.ItemTemplate> 
</TabControl> 

問題はヘッダーだけが表示されますが、コンテンツ（ビュー）は表示されません。代わりに、TabItemクラスへのパスが表示されます。

多くの情報を提供する：トピックに必要なものだけを保持するためにコードを省略し、MVVM Lightを使用します。

ここで私が逃したものは本当に得られません！あなたの助けにThx。

Answer 1

問題は、各タブがTabItemのインスタンスにバインドされていることです。 vm:ExportViewModelとvm:ImportViewModelのDataTemplatesがあります。あなたは今あなたのエラーを見ますか？

これには多くの解決策があります。最も簡単なのは、ヘッダーテキストをベースビューモデルに移動し、そのTabコントロールをViewModelのコレクションにバインドすることです。

もう1つの方法は、TabItemのDataTemplateを追加し、その中にContentControlを置き、をビューモデルにバインドすることです。ここでは、この考え方を説明するために、いくつかのXAMLのような擬似コードです：

<DataTemplate DataType="{x:Type vm:TabItem}"> 
    <ContentControl Content={Binding Content}" /> 
</DataTemplate> 

あなたがContentControlにのリソースにあなたのビューモデルのテンプレートを移動する必要がありますが、私はそれが必要だとは思いません。 TabItemデータテンプレートを調整して、タブウィンドウをいっぱいにする必要があるかもしれません。

第三のオプションは、カスタムDataTemplateSelectorを実装して、タブコントロールにことを用いることであろう。このセレクタでは、単にTabItemを開いて、そのタイプのContentプロパティを見てください。デフォルトのDataTemplateSelectorのソースコードを参照して、指定した型の正しいテンプレートを取得する方法を調べることができます。このメソッドは、興味深い旅行であるWPFの魅力を深く感じます。 私はそれを一度やったことがあり、私はそれをやり直したくない。 実際、あなたのニーズに合わせて、旅行は私のものほど悪くないでしょう。 デフォルトセレクタはスクワットを行わないため、base.SelectTemplateを返すことは無意味です。どのように実装するべきかの例については、フレームワークで掘り下げました。

public class TabItemDataTemplateSelector : DataTemplateSelector 
{ 
    public override DataTemplate 
     SelectTemplate(object item, DependencyObject container) 
    { 
     var viewModel = item as TabItem; 
     if (item == null) 
      return null; 
     else 
      item = viewModel.Content; 

     FrameworkElement fe = null; 
     if (container is ContentPresenter) 
      fe = (container as ContentPresenter) 
        .TemplatedParent as FrameworkElement; 
     else 
      fe = container as FrameworkElement; 

     var key = new DataTemplateKey(item.GetType()); 
     return fe.TryFindResource(key) as DataTemplate; 
    } 
} 

コードが動作する編集どこか

<derp:TabItemDataTemplateSelector x:Key="tidts"/> 

その後、ContentTemplateSelector

<TabControl ItemsSource="{Binding Views}" 
      ContentTemplateSelector={StaticResource tidts}>