C# 在图像上单击并拖动框-WPF

我无法使选择框不居中。在下图中，我试图通过单击并拖动在单词Final Bill accented ms paint box周围绘制一个框，但结果selectionBox的红色虚线始终从中间开始输出。在mouseUp事件中计算并保存的矩形值都是正确的，这表明可能存在XAML显示问题

我对WPF/XAML和前端的东西非常了解

编辑：只需将selectionBox放在一个标签中，我就能让它几乎正常工作。它不再居中，但起点距离左边框和上边框的距离是单击鼠标时的两倍

XAML

---

我不确定我是否完全理解您在这里试图实现的目标，但如果您只需要在文本周围添加边框，而不允许用户用鼠标移动，将图像设置为网格的背景，然后对网格进行分区，使其中一个网格单元直接位于要放置边框的文本上方。将边框放置在该单元格内，如果所有票据图像的大小完全相同，且文本位于完全相同的位置，则只要不允许用户调整图像大小，边框将始终位于该文本的正上方。。。如果需要滚动，只需将整个网格放在ScrollViewer控件中即可

大概是这样的：

  <Grid>  
  <Grid.Background>
    <VisualBrush TileMode="None" >
      <VisualBrush.Visual>
        <Image Source="{Binding ImageSource}"/>
      </VisualBrush.Visual>
    </VisualBrush>
  </Grid.Background>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="80"/> //Distance from the left edge of the image to the right edge of the border around the "Final Bill" text.
    </Grid.ColumnDefinitions>    
    <Grid.RowDefinitions>
      <RowDefinition Height="150"/> //Distance from the top of the image to the top of the desired location of the border around the "Final Bill" text.
      <RowDefinition Height="50"/> //Desired height of the border around the "Final Bill" text.
    </Grid.RowDefinitions>
    <Border Grid.Column="0" Grid.Row="1" BorderThickness="1"/>
  </Grid>

---

只要2美分，我希望这是示例中的模拟数据，并且您没有在internet上共享客户帐户信息…：X由于未使用元素，因此不能使用Canvas.SetLeft或Canvas.SetTop。您可以尝试设置矩形的边距属性，例如边距=10,30,0,0表示距离左侧=10，距离顶部=30；这还需要在矩形上设置HorizontalAlignment=Left和VerticalAlignment=Top。这只是一个想法；我没有测试。谢谢克里斯。该帐户最近被处理，但我还是更改了图像。对不起，请允许我澄清。我有一个用户可以缩放和滚动的图像。单击并拖动后，我只想画一个红色框。很像在windows桌面上单击和拖动的行为。

public MainWindow()
{
    InitializeComponent();

    img_Box.MouseLeftButtonDown += img_Box_MouseLeftButtonDown;
    img_Box.MouseLeftButtonUp += img_Box_MouseLeftButtonUp;
    img_Box.MouseMove += img_Box_MouseMove;

    Point mouseDownPos;
}

private void img_Box_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    img_Box.CaptureMouse();
    var tt = (TranslateTransform)((TransformGroup)img_Box.RenderTransform).Children.First(tr => tr is TranslateTransform);

    double BoxX = (e.GetPosition(img_Box).X / img_Box.ActualWidth) * 1;
    double BoxY = (e.GetPosition(img_Box).Y / img_Box.ActualHeight) * 1;
    double xValue = Math.Round((BoxX * img_Box.Source.Width), 0);
    double yValue = Math.Round((BoxY * img_Box.Source.Height), 0);

    StartDrag = new System.Windows.Point(xValue, yValue);
    mouseDownPos.X = (int)xValue;
    mouseDownPos.Y = (int)yValue;

    Canvas.SetLeft(selectionBox, xValue);
    Canvas.SetTop(selectionBox, yValue);
    selectionBox.Width = 0;
    selectionBox.Height = 0;
    selectionBox.Visibility = Visibility.Visible;
}

private void img_Box_MouseMove(object sender, MouseEventArgs e)
{
    double x = e.GetPosition(img_Box).X;
    double y = e.GetPosition(img_Box).Y;
    double BoxX = (x / img_Box.ActualWidth) * 1;
    double BoxY = (y / img_Box.ActualHeight) * 1;
    double xValue = Math.Round((BoxX * img_Box.Source.Width), 0);
    double yValue = Math.Round((BoxY * img_Box.Source.Height), 0);

    if (mouseDownPos.X < xValue)
    {
        Canvas.SetLeft(selectionBox, mouseDownPos.X);
        selectionBox.Width = xValue - mouseDownPos.X;
    }
    else
    {
        Canvas.SetLeft(selectionBox, xValue);
        selectionBox.Width = mouseDownPos.X - xValue;
    }
    if (mouseDownPos.Y < yValue)
    {
        Canvas.SetTop(selectionBox, mouseDownPos.Y);
        selectionBox.Height = yValue - mouseDownPos.Y;
    }
    else
    {
        Canvas.SetTop(selectionBox, yValue);
        selectionBox.Height = mouseDownPos.Y - yValue;
    }
}

  <Grid>  
  <Grid.Background>
    <VisualBrush TileMode="None" >
      <VisualBrush.Visual>
        <Image Source="{Binding ImageSource}"/>
      </VisualBrush.Visual>
    </VisualBrush>
  </Grid.Background>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="80"/> //Distance from the left edge of the image to the right edge of the border around the "Final Bill" text.
    </Grid.ColumnDefinitions>    
    <Grid.RowDefinitions>
      <RowDefinition Height="150"/> //Distance from the top of the image to the top of the desired location of the border around the "Final Bill" text.
      <RowDefinition Height="50"/> //Desired height of the border around the "Final Bill" text.
    </Grid.RowDefinitions>
    <Border Grid.Column="0" Grid.Row="1" BorderThickness="1"/>
  </Grid>