c# - 有没有办法将椭圆与 WPF C# 上的一条线连接起来？

Question

我有这个任务，我必须编写一个交互式程序，用户单击屏幕并在鼠标单击的位置放置一个点，然后当他放置第二个点时，它们必须连接一条线。

<Window x:Class="courseWorkOOP.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:courseWorkOOP"
    mc:Ignorable="d"
    Title="Практикум ООП" Height="600" Width="800">
<Grid x:Name="myGrid">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
        </Grid.RowDefinitions>

    
    <Canvas Name="myCanvas" Height="480" Width="640" MouseDown="Canvas_MouseDown_1" MouseMove="Canvas_MouseMove_1">
        <Canvas.Background>
            <SolidColorBrush Color="White" Opacity="0"/>
        </Canvas.Background>
    </Canvas>
    <Button Click="btn_Click" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="200" Content="Clear"/>
    <!--<StackPanel HorizontalAlignment="Left">
        <Button Name="btn" Click="btn_Click">Clear</Button>
    </StackPanel>-->
    
</Grid>

这是我的 XAML

 private void Canvas_MouseDown_1(object sender, System.Windows.Input.MouseButtonEventArgs e)
    {
        
        if (e.ButtonState == MouseButtonState.Pressed)
        {
            currentPoint = e.GetPosition(this);
            Ellipse currDot = new Ellipse() { Width = 10, Height = 10,Fill=Brushes.Black };
            myCanvas.Children.Add(currDot);
            Canvas.SetLeft(currDot, e.GetPosition(this).X);
            Canvas.SetTop(currDot, e.GetPosition(this).Y);
            double coordinateX = Canvas.GetLeft(currDot);
            double coordinateY = Canvas.GetTop(currDot);
            Line myLine = new Line() { X1 = coordinateX, Y1 = coordinateY,X2=coordinateY,Y2=coordinateX,Stroke=Brushes.Green,StrokeThickness=4 };
            myCanvas.Children.Add(myLine);
        }
    }
    private void btn_Click(object sender, RoutedEventArgs e)
    {
        myCanvas.Children.Clear();
    }

    private void Canvas_MouseMove_1(object sender, System.Windows.Input.MouseEventArgs e)
    {
        //if (e.LeftButton == MouseButtonState.Pressed)
        //{
        //    Line line = new Line();
        //    line.Stroke = SystemColors.WindowFrameBrush;
        //    line.StrokeThickness = 20;
        //    line.X1 = currentPoint.X;
        //    line.Y1 = currentPoint.Y;
        //    line.X2 = e.GetPosition(this).X;
        //    line.Y2 = e.GetPosition(this).Y;

        //    currentPoint = e.GetPosition(this);

        //    myCanvas.Children.Add(line);
        //}
    }

这是 C# 部分。

我的问题是如何让两个点连接一条线？

我试过ClickCount了，但它什么也没做，我可能用错了。在此之前，我尝试过在里面初始化一个整数值Canvas_MouseDown_1，然后做了一个 If 语句，基本上说在这和每两次点击之间画一条线，但这也不起作用。

标签： c#wpf

Answer 1

为了用线连接点，您需要跟踪上一个单击点，以便您可以将“currentPoint”连接到“previousPoint”。您还需要一个标志，以便仅在画布上至少有一个点时才创建线。

private Point previousPoint;
private Point currentPoint;
private bool hasPoints;

private void Canvas_MouseDown_1(object sender, System.Windows.Input.MouseButtonEventArgs e)
{

    if (e.ButtonState == MouseButtonState.Pressed)
    {
        previousPoint = currentPoint;
        currentPoint = e.GetPosition(this.myCanvas);
        currentPoint.X -= 5; // Use 5, which is half the width/height of the dot
        currentPoint.Y -= 5; // Use 5, which is half the width/height of the dot
        Ellipse currDot = new Ellipse() { Width = 10, Height = 10, Fill = Brushes.Black };
        myCanvas.Children.Add(currDot);
        Canvas.SetLeft(currDot, currentPoint.X);
        Canvas.SetTop(currDot, currentPoint.Y);
        if (hasPoints)
        {
            // Add 4 to the line position, due to the stroke thickness being 4
            Line myLine = new Line() { X1 = previousPoint.X + 4, Y1 = previousPoint.Y + 4, X2 = currentPoint.X + 4, Y2 = currentPoint.Y + 4, Stroke = Brushes.Green, StrokeThickness = 4 };
            myCanvas.Children.Add(myLine);
        }
        hasPoints = true;
    }
}

示例输出：

在下面的评论后编辑：如果您希望每两个点连接，只需进行以下简单的逻辑更改：

if (hasPoints)
{
    // Add 4 to the line position...
    Line myLine = new Line() { X1 ...
    myCanvas.Children.Add(myLine);
    hasPoints = false;
}
else
{
    hasPoints = true;
}

上述代码的输出：