Every day is a new day

ひつじのプログラミング日記。

WPFで矩形トラッカーを描画する(MVVM) その1

前回の続きで、コードビハインドで実装された矩形トラッカーを、今度はDataBinding(MVVM)でやってみたいと思います。

まずは、トラッカー描画の要となるMouseLeftButtonDown、MouseLeftButtonUp、MouseMoveイベントをViewModelとBindingするのにMouseBindingを使おうと思ったのですが、これらのイベントが存在しなかった・・・。

<!--こんな感じでBindingしたかったけど・・・-->
<Grid Background="White">
    <Grid.InputBindings>
        <MouseBinding Gesture="LeftDoubleClick" 
                      Command="{Binding LeftDoubleClickCommand}" />
    </Grid.InputBindings>
</Grid>

 
というわけで、こちらこちらを参考にして、EventTriggerを使うことにしました。

<i:Interaction.Triggers>
    <i:EventTrigger EventName="MouseLeftButtonDown" >
        <i:InvokeCommandAction
              Command="{Binding MouseLeftButtonDownCommand}" />
    </i:EventTrigger>
    <i:EventTrigger EventName="MouseLeftButtonUp" >
        <i:InvokeCommandAction
              Command="{Binding MouseLeftButtonUpCommand}" />
    </i:EventTrigger>
    <i:EventTrigger EventName="MouseMove" >
        <i:InvokeCommandAction
              Command="{Binding MouseMoveCommand}" />
    </i:EventTrigger>
</i:Interaction.Triggers>

  • MainViewModel.cs
private RelayCommand _mouseLeftButtonDownCommand;
public RelayCommand MouseLeftButtonDownCommand
{
    get
    {
        return _mouseLeftButtonDownCommand 
            ?? (_mouseLeftButtonDownCommand = new RelayCommand(
            () =>
            {
                // マウス左ボタンダウン
            }));
    }
}

private RelayCommand _mouseLeftButtonUpCommand;
public RelayCommand MouseLeftButtonUpCommand
{
    get
    {
        return _mouseLeftButtonUpCommand 
            ?? (_mouseLeftButtonUpCommand = new RelayCommand(
            () =>
            {
                // マウス左ボタンアップ
            }));
    }
}

private RelayCommand _mouseMoveCommand;
public RelayCommand MouseMoveCommand
{
    get
    {
        return _mouseMoveCommand 
            ?? (_mouseMoveCommand = new RelayCommand(
            () =>
            {
                // マウス移動
            }));
    }
}


RelayCommandクラスについては、こちらを参考にさせて頂きました。

これらを実装し、イベントが飛んでくることまで確認できたのですが、ここであることに気付きました。
・・・あれっ?これじゃマウスボタンをダウンした位置やマウス移動中の座標わからなくない?矩形作れなくない?

つまりViewModel側でMouseEventArgsやMouseButtonEventArgsを取りたいということなのですが、これはまた次回です・・・。