在WPF中拖放圖像

Question

我正在嘗試將圖像從畫布上的一個位置拖放到另一個位置（應該相對簡單），但無法弄清楚。 我要移動的圖像具有以下XAML：

<Image Height="28" HorizontalAlignment="Left" Margin="842,332,0,0" Name="cityImage" Stretch="Fill" VerticalAlignment="Top" Width="42" Source="/Settlers;component/Images/city.png" MouseLeftButtonDown="cityImage_MouseLeftButtonDown" MouseMove="cityImage_MouseMove" MouseLeftButtonUp="cityImage_MouseLeftButtonUp"/>

代碼如下：

bool isDragging = false; Point initMousePos; private void cityImage_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) {
isDragging = true;
initMousePos = e.GetPosition(theGrid); } private void cityImage_MouseMove(object sender, MouseEventArgs e) {
if (isDragging)
{
    Image image = sender as Image;
    Canvas.SetTop(image, initMousePos.X);
    Canvas.SetLeft(image, initMousePos.Y);
    image.Visibility = System.Windows.Visibility.Visible;
} }

private void cityImage_MouseLeftButtonUp（object sender，MouseButtonEventArgs e）{isDragging = false; }

Answer 1

我要做的就是用你想要的

System.Windows.Controls.Primitives.Thumb 

作為UserControl的根，並將ControlTemplate設置為顯示圖像（在邊框內，但也可以不顯示），例如：

<Thumb Name="myRoot" DragDelta="MyRootDragDelta">
  <Thumb.Template>
    <ControlTemplate>
      <Image ... >
      ... see below ...
      </Image>
    </ControlTemplate>
  </Thumb.Template>
</Thumb>

另外，我將Image的Source綁定到該類的屬性：

<Image.Source>
  <Binding Path="ImageSource" RelativeSource=
                 {RelativeSource FindAncestor,
                  AncestorType=my:MyImageControl, AncestorLevel=1}" />
</Image.Source>

UserControl具有一個名為TranslateTransform （例如， translateTransform ），其屬性X和Y將在DragDelta事件處理程序中設置：

private void MyRootDragDelta(object sender, DragDeltaEventArgs e) 
{
  translateTransform.X += e.HorizontalChange;
  translateTransform.Y += e.VerticalChange;
}

不要忘記添加：

public ImageSource ImageSource { get; set; }

希望這可以幫助。 如果有任何不清楚的地方，請隨時詢問。

Answer 2

您想要將“畫布”的“左”和“上”屬性設置為初始位置以外的其他值。 在MouseMove處理程序中，您必須獲取相對於父級的位置。 也; 確保父元素是畫布而不是網格。 您在圖像上的左邊距和頂部都有很大的空白，以及帶有變量名稱“ theGrid”的控件。