WPF C#使用MouseDown、MouseMove拖动Canvas内Ellipse出现抖动问题求助

• 参考对象取错：原代码MouseDown事件中调用Canvas.GetLeft(this)时，this指向MainWindow窗口实例，并非名为circulito的Ellipse控件，获取的初始位置基准完全错误
• 坐标参考系混乱：MouseMove事件中使用e.GetPosition(circulito)获取鼠标位置时，参考系是随椭圆实时移动的椭圆自身。一旦椭圆开始位移，鼠标相对于椭圆的相对坐标会自动生成增量，和原有位置基准叠加后会把位移量翻倍，直接引发位置跳变、抖动
• 缺少鼠标捕获逻辑：如果拖动时鼠标移动速度过快、滑出Ellipse的边界，MouseMove事件会直接中断，造成拖动卡顿、位置跳变
• 缺少收尾逻辑：没有在松开鼠标时结束拖动状态，容易出现鼠标松开后椭圆仍跟随移动的异常

• 统一以Ellipse所在的父Canvas作为固定坐标参考系，所有位置计算都在不随控件移动的Canvas坐标系下完成
• 鼠标按下时，提前计算鼠标点击位置和椭圆左上角的固定偏移量，这个值在整个拖动过程中保持不变，不会随椭圆位置移动产生变化
• 拖动开始时对Ellipse做鼠标捕获，保证鼠标滑出椭圆范围时，拖动相关事件也能持续触发
• 鼠标松开时主动释放鼠标捕获、标记拖动状态结束

前端XAML #

<Canvas>
        <Ellipse x:Name="circulito" Fill="#FFFDC347" Height="100" Stroke="Black"  Width="100"
        MouseDown="circulito_MouseDown"
        MouseMove="circulito_MouseMove"
        MouseUp="circulito_MouseUp"/>
</Canvas>

后台C#逻辑 #

public partial class MainWindow : Window
{
    // 鼠标按下时，点击位置与椭圆左上角的固定偏移
    private Point _dragOffset;
    // 拖动状态标记
    private bool _isDragging;

    public MainWindow()
    {
        InitializeComponent();
    }

    private void circulito_MouseDown(object sender, MouseButtonEventArgs e)
    {
        // 处理椭圆未设置初始位置时的NaN异常
        double currentEllipseLeft = double.IsNaN(Canvas.GetLeft(circulito)) ? 0 : Canvas.GetLeft(circulito);
        double currentEllipseTop = double.IsNaN(Canvas.GetTop(circulito)) ? 0 : Canvas.GetTop(circulito);
        
        // 获取鼠标在Canvas固定坐标系下的点击位置
        Point mousePosOnCanvas = e.GetPosition((Canvas)circulito.Parent);
        
        // 计算固定偏移值，拖动全程该值无变化
        _dragOffset = new Point(
            mousePosOnCanvas.X - currentEllipseLeft, 
            mousePosOnCanvas.Y - currentEllipseTop);
        
        // 捕获鼠标，保证拖动过程不中断
        circulito.CaptureMouse();
        _isDragging = true;
    }

    private void circulito_MouseMove(object sender, MouseEventArgs e)
    {
        // 非拖动状态、左键未按下时直接跳过逻辑
        if (!_isDragging || Mouse.LeftButton != MouseButtonState.Pressed)
            return;
        
        // 始终在Canvas固定坐标系下获取当前鼠标位置
        Point currentMousePosOnCanvas = e.GetPosition((Canvas)circulito.Parent);
        
        // 鼠标当前位置减去固定偏移，得到椭圆的正确放置位置
        Canvas.SetLeft(circulito, currentMousePosOnCanvas.X - _dragOffset.X);
        Canvas.SetTop(circulito, currentMousePosOnCanvas.Y - _dragOffset.Y);
    }

    private void circulito_MouseUp(object sender, MouseButtonEventArgs e)
    {
        // 松开鼠标时结束拖动、释放鼠标捕获
        _isDragging = false;
        circulito.ReleaseMouseCapture();
    }
}

这种实现方式从根上避免了参考系随控件动态变化带来的位置跳变，拖动过程顺滑无抖动，不会出现位置来回漂移的问题。

内容的提问来源于stack exchange，提问作者Ivan Cortes