wpf 创建一个虚拟摇杆

在 WPF 中创建一个虚拟摇杆可以分为以下几个步骤：

1. 创建一个圆形控件，作为摇杆的背景。

2. 在圆形控件上添加一个可移动的小球，作为摇杆的指针。

3. 监听小球的移动事件，并计算其相对于圆心的位置，以及相对于圆的角度。

4. 根据小球的位置和角度，计算出摇杆的输出值。

下面是一个简单的实现示例：

首先，创建一个名为 Joystick 的 UserControl，用于显示摇杆。在 Joystick 中添加一个 Canvas 控件，用于放置圆形背景和小球指针。

<UserControl x:Class="WpfApp1.Joystick"
             ...
             >
    <Canvas x:Name="canvas"
            Width="100"
            Height="100">
    </Canvas>
</UserControl>

接下来，添加一个名为 Background 的 Ellipse 控件，作为圆形背景。

<Ellipse x:Name="Background"
         Width="100"
         Height="100"
         Fill="Gray" />

然后，添加一个名为 Thumb 的 Ellipse 控件，作为小球指针。将 Thumb 控件的鼠标事件绑定到 Thumb_DragDelta 方法上，用于处理小球的移动事件。

<Ellipse x:Name="Thumb"
         Width="20"
         Height="20"
         Fill="Red"
         Canvas.Left="40"
         Canvas.Top="40"
         MouseDown="Thumb_DragDelta"
         MouseMove="Thumb_DragDelta"
         MouseUp="Thumb_DragDelta" />

在 Thumb_DragDelta 方法中，计算小球的位置和角度，并将其输出值传递给 Joystick 的 ValueChanged 事件。

private void Thumb_DragDelta(object sender, DragDeltaEventArgs e)
{
    double x = Canvas.GetLeft(Thumb) + e.HorizontalChange;
    double y = Canvas.GetTop(Thumb) + e.VerticalChange;
    double cx = canvas.ActualWidth / 2;
    double cy = canvas.ActualHeight / 2;
    double dx = x - cx;
    double dy = cy - y;
    double angle = Math.Atan2(dy, dx) * 180 / Math.PI;
    double distance = Math.Sqrt(dx * dx + dy * dy) / (canvas.ActualWidth / 2);
    if (distance > 1) {
        distance = 1;
        x = cx + dx / Math.Sqrt(dx * dx + dy * dy) * (canvas.ActualWidth / 2);
        y = cy - dy / Math.Sqrt(dx * dx + dy * dy) * (canvas.ActualHeight / 2);
    }
    if (x < 0) x = 0;
    if (x > canvas.ActualWidth - Thumb.ActualWidth) x = canvas.ActualWidth - Thumb.ActualWidth;
    if (y < 0) y = 0;
    if (y > canvas.ActualHeight - Thumb.ActualHeight) y = canvas.ActualHeight - Thumb.ActualHeight;
    Canvas.SetLeft(Thumb, x);
    Canvas.SetTop(Thumb, y);
    ValueChanged?.Invoke(this, new JoystickEventArgs(angle, distance));
}

最后，在 Joystick 中添加一个名为 ValueChanged 的事件，用于传递摇杆的输出值。

public event EventHandler<JoystickEventArgs> ValueChanged;

JoystickEventArgs 类用于传递摇杆的输出值，包括角度和距离。

public class JoystickEventArgs : EventArgs
{
    public double Angle { get; }
    public double Distance { get; }

    public JoystickEventArgs(double angle, double distance)
    {
        Angle = angle;
        Distance = distance;
    }
}

现在，你可以在需要使用虚拟摇杆的地方使用 Joystick 控件，并订阅 ValueChanged 事件来获取摇杆的输出值。

<Joystick x:Name="joystick"
          ValueChanged="joystick_ValueChanged" />

private void joystick_ValueChanged(object sender, JoystickEventArgs e)
{
    // 获取摇杆的输出值
}