C#在Canvas中拖放图像

Question

我试图谷歌如何在画布上拖放UIElements,但找不到任何我正在寻找的东西.

我有一个带有Window的C#WPF应用程序.在窗口内我有一个Canvas,我可以在其中添加图像.我想要的是能够拖放图像,同时保持在画布的边界内.我也希望它在代码中,所以不在xaml中.

我在我添加/更新图像到画布的功能中得到了这个.TODO应该替换为拖放事件.

Image img = ImageList[i].Image;
img.Name = "Image" + i;

// TODO: Drag and Drop event for Image

// TODO: Check if Left and Top are within Canvas (minus width / height of Image) 

Canvas.SetLeft(img, Left); // Default Left when adding the image = 0
Canvas.SetTop(img, Top); // Default Top when adding the image = 0

MyCanvas.Children.Add(img);
OnPropertyChanged("MyCanvas");

PS:虽然这是为了以后,如果有人有代码一次拖放多个图像作为额外的奖金,我会很感激.

在此先感谢您的帮助.

Answer 1

通过使用以下代码修复了我的问题:

img.AllowDrop = true;
img.PreviewMouseLeftButtonDown += this.MouseLeftButtonDown;
img.PreviewMouseMove += this.MouseMove;
img.PreviewMouseLeftButtonUp += this.PreviewMouseLeftButtonUp;


private object movingObject;
private double firstXPos, firstYPos;
private void MouseLeftButtonDown(object sender, MouseButtonEventArgs e) {
    // In this event, we get the current mouse position on the control to use it in the MouseMove event.
    Image img = sender as Image;
    Canvas canvas = img.Parent as Canvas;

    firstXPos = e.GetPosition(img).X;
    firstYPos = e.GetPosition(img).Y;

    movingObject = sender;

    // Put the image currently being dragged on top of the others
    int top = Canvas.GetZIndex(img);
    foreach (Image child in canvas.Children)
        if (top < Canvas.GetZIndex(child))
            top = Canvas.GetZIndex(child);
    Canvas.SetZIndex(img, top + 1);
}
private void PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e) {
    Image img = sender as Image;
    Canvas canvas = img.Parent as Canvas;

    movingObject = null;

    // Put the image currently being dragged on top of the others
    int top = Canvas.GetZIndex(img);
    foreach (Image child in canvas.Children)
        if (top > Canvas.GetZIndex(child))
            top = Canvas.GetZIndex(child);
    Canvas.SetZIndex(img, top + 1);
}
private void MouseMove(object sender, MouseEventArgs e) {
    if (e.LeftButton == MouseButtonState.Pressed && sender == movingObject) {
        Image img = sender as Image;
        Canvas canvas = img.Parent as Canvas;

        double newLeft = e.GetPosition(canvas).X - firstXPos - canvas.Margin.Left;
        // newLeft inside canvas right-border?
        if (newLeft > canvas.Margin.Left + canvas.ActualWidth - img.ActualWidth)
            newLeft = canvas.Margin.Left + canvas.ActualWidth - img.ActualWidth;
        // newLeft inside canvas left-border?
        else if (newLeft < canvas.Margin.Left)
            newLeft = canvas.Margin.Left;
        img.SetValue(Canvas.LeftProperty, newLeft);

        double newTop = e.GetPosition(canvas).Y - firstYPos - canvas.Margin.Top;
        // newTop inside canvas bottom-border?
        if (newTop > canvas.Margin.Top + canvas.ActualHeight - img.ActualHeight)
            newTop = canvas.Margin.Top + canvas.ActualHeight - img.ActualHeight;
        // newTop inside canvas top-border?
        else if (newTop < canvas.Margin.Top)
            newTop = canvas.Margin.Top;
        img.SetValue(Canvas.TopProperty, newTop);
    }
}

这段代码允许我在Canvas中拖放图像,而不必离开Canvas本身.

现在我只需要做两件事:

1. 修复一个小小的bug,当我将它们拖动到快速时,我的鼠标滑动了Image.这种情况经常发生,即使我甚至没有快速移动拖动图像. 通过使用我在其他问题中提到的解决方案.
2. 使其能够一次拖放多个图像,最好先选择多个图像,然后在停留在Canvas内部的同时拖放整个图像.

将为此提出一个新的问题.