在 wpf 中绘制时为线条设置动画

Posted 2023-04-01

【中文标题】在 wpf 中绘制时为线条设置动画

【英文标题】：Animating a line while drawing in wpf

【发布时间】：2022-01-09 19:08:08

【问题描述】：

XAML

<Canvas Name="canvas" MouseDown="canvas_MouseDown" MouseUp="canvas_MouseUp" Background="White" MouseMove="canvas_MouseMove" />

C#

Line AnimationLine;
Point P1;
private void canvas_MouseDown(object sender, MouseButtonEventArgs e)

    P1 = e.GetPosition(canvas);
    AnimationLine = new Line()  Stroke = new SolidColorBrush  Color = Colors.Blue ,StrokeThickness = 3;
    AnimationLine.X1 = P1.X;
    AnimationLine.Y1 = P1.Y;
    canvas.Children.Add(AnimationLine);



private void canvas_MouseUp(object sender, MouseButtonEventArgs e)

    var P2 = e.GetPosition(canvas);
    canvas.Children.Remove(AnimationLine);
    //AnimationLine = new Line();
    canvas.Children.Add
      (new Line()
      
          X1 = P1.X,
          Y1 = P1.Y,
          X2 = P2.X,
          Y2 = P2.Y,
          StrokeThickness = 3,
          Stroke = new SolidColorBrush  Color = Colors.Blue 
      );


private void canvas_MouseMove(object sender, MouseEventArgs e)

    if(e.LeftButton == MouseButtonState.Pressed)
     
       var P2 = e.GetPosition(canvas);
       AnimationLine.X2 = P2.X;
       AnimationLine.Y2 = P2.Y;
    

我正在尝试绘制一条线，第一个点分配给鼠标向下，第二个点分配给鼠标，这就是绘制线条的时候，但是当拖动时我想显示动画线，就像实时的动画线指导方针。

为了得到它，我想画一条线，就像在 microsoft paint 中一样。

我刚刚写了上面的内容，效果很好，但这真的是这样做的方法吗？任何可以提供帮助的内置功能？

【问题讨论】：

这取决于您要达到的目标，而您根本没有解释。您刚刚展示了您的代码，让我们猜测它应该做什么。无论如何，对我来说，您创建的 Line 对象似乎比实际需要的要多得多。为什么要在canvas_MouseUp 中分配AnimationLine = new Line()？

@Clemens 我正在尝试绘制一条线，第一个点分配给鼠标向下，第二个点分配给鼠标，这就是绘制线条的时候，但是当拖动时我想显示动画线，动画就像一条指导线的线，为了得到它，我想画一条线，就像在 microsoft paint 中一样，AnimationLine = new Line() 以便它被删除

@user1492051，尝试注释掉canvas_MouseUp 中的代码，看看是否有什么不同。此外，您在鼠标移动处理程序中检查了e.LeftButton，但在鼠标按下处理程序中没有检查，因此鼠标右键的作用不同（不知道是否有意）。

@icebat 是这样设计的/跨度>

【参考方案1】：

您的代码可以简化如下所示。特别是您应该为MouseLeftButtonDown 和MouseLeftButtonUp 事件添加处理程序，而不是更一般的MouseDown 和MouseUp 事件。另请注意，您通常会capture the mouse，并且拥有鼠标向上处理程序的唯一目的是释放鼠标捕获。

XAML：

<Canvas Background="Transparent"
        MouseLeftButtonDown="Canvas_MouseLeftButtonDown"
        MouseLeftButtonUp="Canvas_MouseLeftButtonUp"
        MouseMove="Canvas_MouseMove"/>

后面的代码：

private void Canvas_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

    var canvas = (Canvas)sender;

    if (canvas.CaptureMouse())
    
        var startPoint = e.GetPosition(canvas);
        var line = new Line
        
            Stroke = Brushes.Blue,
            StrokeThickness = 3,
            X1 = startPoint.X,
            Y1 = startPoint.Y,
            X2 = startPoint.X,
            Y2 = startPoint.Y,
        ;

        canvas.Children.Add(line);
    


private void Canvas_MouseMove(object sender, MouseEventArgs e)

    var canvas = (Canvas)sender;

    if (canvas.IsMouseCaptured && e.LeftButton == MouseButtonState.Pressed)
    
        var line = canvas.Children.OfType<Line>().LastOrDefault();

        if (line != null)
        
            var endPoint = e.GetPosition(canvas);
            line.X2 = endPoint.X;
            line.Y2 = endPoint.Y;
        
    


private void Canvas_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)

    ((Canvas)sender).ReleaseMouseCapture();