ViewModelによるユーザーコントロールの切り替え方法

Viewmodel内でパネルの内容を動的に切り替える方法を記します。

方法としてはDataTemplateを定義して切り替えます。

手順は下記の通りです。

App.XamlにViewとViewModelのマッチングをApplicationのリソースに定義します。

<Application.Resources>
　　<DataTemplate DataType="{x:Type local:Panel1ViewModel}">
　　　　<local:Panel1View/>
　　</DataTemplate>
　　<DataTemplate DataType="{x:Type local:Panel2ViewModel}">
　　　　<local:Panel2View/>
　　</DataTemplate>
</Application.Resources>

XamlにContentControlを配置する。

<ContentControl Content="{Binding ViewModel}"/>

ViewModelで表示するViewModelを設定する。

public class MainViewModel : BaseViewModel
{
　　// 表示させる画面のViewModel
　　public BaseViewModel ViewModel
　　{
　　　　get { return base.Get<BaseViewModel >(); }
　　　　set { base.Set(value);
　　}

　　public MainViewModel(int no)
　　{
　　　　if (no == 0)
　　　　{
　　　　　　this.ViewModel = new Panel1ViewModel();
　　　　}
　　　　else
　　　　{
　　　　　　this.ViewModel = new Panel2ViewModel();
　　　　}
　　}
}