在运行时 WPF 上画线

Question

我想使用鼠标在运行时画线。我尝试过以下方式

 private void Image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        FrameworkElement f = e.Source as FrameworkElement;
        FrameworkElement pr = f.Parent as FrameworkElement;
        Rect feRect = f.TransformToAncestor(pr).TransformBounds(
                      new Rect(0.0, 0.0, f.ActualWidth, f.ActualHeight));
        Image image = sender as Image;


        Point textLocation = e.GetPosition(image);

        textLocation.Offset(-4, -4);
        var Top = feRect.Height - textLocation.Y;
        var Bottom = textLocation.Y - 1;
        var Left = textLocation.X - 1;
        var Right = feRect.Width-textLocation.X;


        // Create an annotation where the mouse cursor is located.and add control using adorner layer
        _currentAnnotations = ImageAnnotation.Create(
            image,
            textLocation,
            feRect
            );


    }
  private void Image_MouseMove(object sender, MouseEventArgs e)
    {
        if (e.LeftButton == MouseButtonState.Pressed)
        {
            Image image = sender as Image;

            EndPosition = e.MouseDevice.GetPosition(image);
            // Draw next line and...
            l.X1 = StartPosition.X;
            l.X2 = EndPosition.X;
            l.Y1 = StartPosition.Y;
            l.Y2 = EndPosition.Y;
            l.Stroke = Brushes.Red;
            l.StrokeThickness = 5;


            StartPosition = EndPosition;
        }
        if(_currentAnnotations!=null && l!=null)
        _currentAnnotations.Lines = l;

    }

但它没有给出预期的结果。得到的线与鼠标位置不同。我的输出应该像钢笔工具。 1.我的方式有什么问题？ 2.inkCanvas 是在 wpf 中画线的唯一方法吗？如果是，为什么会这样？ 3.

Answer 1

1.我的方式有什么问题？

您可以尝试在Image_MouseLeftButtonDown 事件处理程序中设置StartPosition 属性：

private void Image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    FrameworkElement f = e.Source as FrameworkElement;
    FrameworkElement pr = f.Parent as FrameworkElement;
    Rect feRect = f.TransformToAncestor(pr).TransformBounds(
                  new Rect(0.0, 0.0, f.ActualWidth, f.ActualHeight));
    Image image = sender as Image;
    ...
    StartPosition = e.MouseDevice.GetPosition(image);
}

InkCanvas 是唯一可以接收和显示墨迹笔划的内置 WPF 控件。但例如，您可以将线条添加到 Canvas 或自己执行任何其他类型的自定义绘图操作。

这是一个基本示例，应该可以为您提供思路。

public partial class MainWindow : Window
{
    public MainWindow ()
    {
        InitializeComponent();
    }

    Point EndPosition;
    Point StartPosition;

    private void canvas_MouseMove(object sender, MouseEventArgs e)
    {
        if (e.LeftButton == MouseButtonState.Pressed)
        {
            FrameworkElement fe = sender as FrameworkElement;

            EndPosition = e.MouseDevice.GetPosition(fe);

            Line l = new Line();
            l.X1 = StartPosition.X;
            l.X2 = EndPosition.X;
            l.Y1 = StartPosition.Y;
            l.Y2 = EndPosition.Y;
            l.Stroke = Brushes.Red;
            l.StrokeThickness = 5;

            StartPosition = EndPosition;
            canvas.Children.Add(l);
        }
    }

    private void canvas_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        FrameworkElement fe = sender as FrameworkElement;
        StartPosition = e.MouseDevice.GetPosition(fe);
    }
}

---

<Canvas x:Name="canvas" Width="500" Height="500" Background="Yellow"
    MouseLeftButtonDown="canvas_MouseLeftButtonDown" MouseMove="canvas_MouseMove" />