将 MouseButtonEventArgs 后面的代码转换为 MVVM

Question

我还是 MVVM 新手，但我正在努力学习它。

我需要将绘制的矩形调整到我的画布中。但我想用 MVVM 的方式来做。

我发现这篇文章和它的工作，它满足我的需要，但它不是 MVVM

https://denisvuyka.wordpress.com/2007/10/15/wpf-simple-adorner-usage-with-drag-and-resize-operations/

我正在尝试将此代码转换为 MVVM

// Handler for element selection on the canvas providing resizing adorner
        void myCanvas_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            // Remove selection on clicking anywhere the window
            if (selected)
            {
                selected = false;
                if (selectedElement != null)
                {
                    // Remove the adorner from the selected element
                    aLayer.Remove(aLayer.GetAdorners(selectedElement)[0]);                    
                    selectedElement = null;
                }
            }

            // If any element except canvas is clicked, 
            // assign the selected element and add the adorner
            if (e.Source != myCanvas)
            {
                _isDown = true;
                _startPoint = e.GetPosition(myCanvas);

                selectedElement = e.Source as UIElement;

                _originalLeft = Canvas.GetLeft(selectedElement);
                _originalTop = Canvas.GetTop(selectedElement);

                aLayer = AdornerLayer.GetAdornerLayer(selectedElement);
                aLayer.Add(new ResizingAdorner(selectedElement));
                selected = true;
                e.Handled = true;
            }
        }

我正在使用 Devexpress MVVM

这是我的 xaml 代码

 <Canvas Name="myCanvas" Background="Gray">
        <dxmvvm:Interaction.Behaviors>
            <dxmvvm:EventToCommand Command="{Binding OnSelectedCommand , Source={x:Static vm:Vm.instance}}" 
                                       EventName="MouseDown" CommandParameter="{Binding ElementName=myCanvas}"
                                       PassEventArgsToCommand="True">
            </dxmvvm:EventToCommand>
        </dxmvvm:Interaction.Behaviors>
</Canvas >

我正在尝试将画布传递到我的视图模型中。

这是我的 ViewModel 的代码

public DelegateCommand<Canvas> OnSelectedCommand { get; private set; }
        public Vm()
        {
            OnSelectedCommand = new DelegateCommand<Canvas>(OnSelectedEvent, true);
        }
        Canvas c = new Canvas();
        private void OnSelectedEvent(object e)
        {
            if (e == null) return;
            c = e as Canvas;

            // Remove selection on clicking anywhere the window
            if (selected)
            {
                selected = false;
                if (selectedElement != null)
                {
                    // Remove the adorner from the selected element
                    aLayer.Remove(aLayer.GetAdorners(selectedElement)[0]);
                    selectedElement = null;
                }
            }

            // If any element except canvas is clicked, 
            // assign the selected element and add the adorner
            if (e.Source != myCanvas)
            {
                _isDown = true;
                _startPoint = e.GetPosition(myCanvas);

                selectedElement = e.Source as UIElement;

                _originalLeft = Canvas.GetLeft(selectedElement);
                _originalTop = Canvas.GetTop(selectedElement);

                aLayer = AdornerLayer.GetAdornerLayer(selectedElement);
                aLayer.Add(new ResizingAdorner(selectedElement));
                selected = true;
                e.Handled = true;
            }
        }

目前我的代码不起作用。在后面的代码中，我有方法中需要的MouseButtonEventArgs。

我现在面临的问题是它如何访问MouseButtonEventArgs？

没有它。我无法使用博客中的示例代码

Answer 1

您可以使用行为来实现您的目标。

首先，将以下两个程序集引用添加到您的项目中：

System.Windows.Interactivity.dll

Microsoft.Expression.Interactions.dll

添加以下 xaml 命名空间：

xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"

然后像这样为 Canvas 控件添加行为：

    <Canvas>
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="PreviewMouseLeftButtonDown">
                <ei:CallMethodAction MethodName="OnLeftButtonClicked" TargetObject="{Binding}" />
            </i:EventTrigger>
        </i:Interaction.Triggers>
        ...
    </Canvas>

EventTrigger 是一种触发行为，它将侦听引发的特定事件。 CallMethodAction 是一个动作，它将调用由TargetObject 和MethodName 属性指定的方法。这里TargetObject的值是{Binding}，表示目标对象就是你的view model，所以它会从你的view model中调用一个这样名字的方法。

然后，在您的视图模型中，添加以下方法：

    public void OnLeftButtonClicked(object s,MouseButtonEventArgs e)
    {

    }

注意：

1. 修饰符应该是public;

2. 方法名称应与CallMethodAction的MethodName属性相同；