如何停止此闪烁问题，当使用触摸移动UI元素时会发生这种情况？

Question

当我尝试使用触摸移动文本块时出现问题，当我使用鼠标交互进行同样的操作时，不会出现闪烁的问题。有人可以在这里帮助我吗？

如何停止此闪烁的问题？

  public partial class MainWindow: Window
  {
    Canvas can = new Canvas() { Background=Brushes.White};
    Grid grid = new Grid() { Height=150,Width=100,Background=Brushes.Yellow};
    TextBlock textBlock = new TextBlock() { Text = "TextBlock Text" ,FontWeight=FontWeights.Bold };
    Point point = new Point();
    public MainWindow()
    {
        InitializeComponent();
        grid.Children.Add(textBlock);
        can.Children.Add(grid);
        Canvas.SetLeft(grid, 0);
        Canvas.SetTop(grid, 0);
        textBlock.PreviewMouseDown += TextBlock_PreviewMouseDown;
        textBlock.PreviewTouchDown += TextBlock_PreviewTouchDown;
        can.PreviewMouseMove += Can_PreviewMouseMove;
        can.PreviewTouchMove += Can_PreviewTouchMove;
        m_grid.Children.Add(can);

    }

    private void TextBlock_PreviewTouchDown(object sender, TouchEventArgs e)
    {
        point = e.GetTouchPoint(this).Position;

    }

    private void TextBlock_PreviewMouseDown(object sender, MouseButtonEventArgs e)
    {

            point = e.GetPosition(this);
    }

    private void Can_PreviewTouchMove(object sender, TouchEventArgs e)
    {
        if (e.OriginalSource is TextBlock )
        {
            Canvas.SetLeft(grid, e.GetTouchPoint(this).Position.X - point.X);
            Canvas.SetTop(grid, e.GetTouchPoint(this).Position.Y - point.Y);
        }
    }


    private void Can_PreviewMouseMove(object sender, MouseEventArgs e)
    {
        if(e.OriginalSource is TextBlock && e.LeftButton==MouseButtonState.Pressed&&e.StylusDevice==null)
        {
            Canvas.SetLeft(grid, e.GetPosition(this).X - point.X);
            Canvas.SetTop(grid, e.GetPosition(this).Y - point.Y);
        }
    }

}

Answer 1

我无法再现您遇到的闪烁，但是我认为这可能是由于您执行了拖放操作。

我在您发布的代码中遇到的第一个问题是在PreviewTouchDown和PreviewMouseDown事件处理程序中。该代码已将point设置为相对于this-Window，当您第一次拖动时可以，但是在此之后进行任何其他拖动尝试都会立即将该项目移到顶部/左上角。 >

为了解决此问题，我编辑了事件处理程序，将point设置为相对于grid，以便在后续拖动中拖动计算正确。

第二个问题是拖动时没有捕获鼠标或触摸设备，当在grid的边缘附近拖动时，这将导致拖动停止。捕获鼠标或触摸也将使拖动更加平滑。

[为了解决这个问题，我在PreviewTouchDown和PreviewMouseDown事件处理程序中添加了鼠标和触摸捕获，并添加了释放捕获的TouchUp和MouseUp事件处理程序。

这里是完整的更新代码：

public partial class MainWindow : Window
{
    private Canvas can = new Canvas() { Background = Brushes.White };
    private Grid grid = new Grid() { Height = 150, Width = 100, Background = Brushes.Yellow };
    private TextBlock textBlock = new TextBlock() { Text = "TextBlock Text", FontWeight = FontWeights.Bold };
    private Point point = new Point();

    public MainWindow()
    {
        InitializeComponent();
        grid.Children.Add(textBlock);
        can.Children.Add(grid);
        Canvas.SetLeft(grid, 0);
        Canvas.SetTop(grid, 0);
        textBlock.PreviewMouseDown += TextBlock_PreviewMouseDown;
        textBlock.PreviewTouchDown += TextBlock_PreviewTouchDown;
        textBlock.MouseUp += TextBlock_MouseUp;
        textBlock.TouchUp += TextBlock_TouchUp;
        can.PreviewMouseMove += Can_PreviewMouseMove;
        can.PreviewTouchMove += Can_PreviewTouchMove;
        RootGrid.Children.Add(can);
    }

    private void TextBlock_PreviewTouchDown(object sender, TouchEventArgs e)
    {
        point = e.GetTouchPoint(grid).Position;
        e.TouchDevice.Capture(textBlock);
    }

    private void TextBlock_PreviewMouseDown(object sender, MouseButtonEventArgs e)
    {
        point = e.GetPosition(grid);
        e.MouseDevice.Capture(textBlock);
    }

    private void TextBlock_TouchUp(object sender, TouchEventArgs e)
    {
        e.TouchDevice.Capture(null);
    }

    private void TextBlock_MouseUp(object sender, MouseButtonEventArgs e)
    {
        e.MouseDevice.Capture(null);
    }

    private void Can_PreviewTouchMove(object sender, TouchEventArgs e)
    {
        if (e.OriginalSource is TextBlock)
        {
            Canvas.SetLeft(grid, e.GetTouchPoint(this).Position.X - point.X);
            Canvas.SetTop(grid, e.GetTouchPoint(this).Position.Y - point.Y);
        }
    }

    private void Can_PreviewMouseMove(object sender, MouseEventArgs e)
    {
        if (e.OriginalSource is TextBlock && e.LeftButton == MouseButtonState.Pressed && e.StylusDevice == null)
        {
            Canvas.SetLeft(grid, e.GetPosition(this).X - point.X);
            Canvas.SetTop(grid, e.GetPosition(this).Y - point.Y);
        }
    }
}
我希望这会有所帮助。