RelayCommandの実装いろいろ MVVM Light Toolkit

MVVM Light ToolkitのRelayCommandの実装方法を色々と紹介する。今回はWPFで実装している。


１、コマンドパラメータなし
何も特別なことはなし
Xaml

?

1 2	<Button Command="{Binding ClickCommand}"         Content="Click Me" />

ViewModel

?

1 2 3 4 5

public RelayCommand ClickCommand { get; private set; } ClickCommand = new RelayCommand(() => {   // Do something... });

２、コマンドパラメータあり
ItemsControlのDataTemplate内要素のイベントをフックしている。ここでのDataTemplateのDataContextはDataItemになるので、単純にClickCommandをBindingしても期待した動作にはならない。そのためRelativeSrouceで一番上の親要素（Window）までたどってViewModelを取得している。CommandParameterにDataTemplateのDataContextをBindingしている。

Xaml

?

1 2 3 4 5 6 7 8 9

<ItemsControl ItemsSource="{Binding DataList}">  <ItemsControol.ItemTemplate>   <DataTemplate>    <Button Command="{Binding DataContext.ClickCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}"  　  　　　CommandParameter="{Binding}"            Content="Click Me" />    </DataTemplate>  </ItemsControol.ItemTemplate> </ItemsControl>

ViewModel

?

1 2 3 4 5 6

public ObservableCollection<DataItem> DataList { get; set; } public RelayCommand<DataItem> ClickCommand { get; private set; } ClickCommand = new RelayCommand(x => {   // Do something... });

３、ICommand以外をBinding
WindowのLoadedイベントなどをBindingしたい場合はEventToCommandを使用する。
・まずXAMLのネームスペースに下記を追加する：
　xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
　xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WPF4"
・後はフックしたいイベントを下記の要領で記述する

Xaml

?

1 2 3 4 5 6 7 8 9 10 11

<Window x:Class="MainWindow"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"         xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WPF4"         DataContext="{Binding ViewModel, Source={StaticResource Locator}}">   <i:Interaction.Triggers>         <i:EventTrigger EventName="Loaded">             <cmd:EventToCommand Command="{Binding WindowLoadedCommand}"/>         </i:EventTrigger>     </i:Interaction.Triggers>

ViewModel

?

1 2 3 4 5

public RelayCommand WindowLoadedCommand{ get; private set; } WindowLoadedCommand= new RelayCommand(() => {   // Do something... });

４、ICommand以外をBinding　パラメータあり
WindowのClosingイベントなどでパラメータを渡したい場合はPassEventArgsToCommandをTrueに設定する。

Xaml

?

1 2 3 4 5 6 7 8 9 10 11

<Window x:Class="MainWindow"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"         xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WPF4"         DataContext="{Binding ViewModel, Source={StaticResource Locator}}">   <i:Interaction.Triggers>         <i:EventTrigger EventName="Closing">             <cmd:EventToCommand Command="{Binding WindowClosingCommand}" PassEventArgsToCommand="True" />         </i:EventTrigger>     </i:Interaction.Triggers>

ViewModel

?

1 2 3 4 5

public RelayCommand WindowClosingCommand<System.ComponentModel.CancelEventArgs>{ get; private set; } WindowClosingCommand= new RelayCommand(x => {   // Do something... });

今回解説したようにEventToCommandを使用するとICommandに対応していないイベントもBinding可能となる。Window要素のイベントに限らずどのような要素にも適用できるのでEventToCommandを使用すればコードビハインドを経由してイベントをリレーする必要がなくなる。