c# - 如何使用触摸将元素拖出可滚动的 ListView，而无需按住元素 [UWP]

Question

就目前而言，将元素拖出 ListView 的功能意味着用户必须长按或“按住”元素才能激活元素的拖动功能。

问题是我们的实时测试表明这对最终用户而言远非直观。

我遇到了 this question有一些有趣的想法，但评论说他们最终找不到解决方案，最后一次事件是3年前。

或许有人在此期间找到了解决方案或解决方法？上下文是我目前使用 ListView因为它必须 可以水平滚动，但我需要 images在 ListView 内可垂直拖动并与 ListView 分离.

Answer 1

@AdamMcMahon 从您帖子的声音来看，您希望能够让列表中的图像项响应触摸拖动 (PointerPressed)，这本身是可能的，并且通过连接 ListView 项模板非常简单以下几行:

<DataTemplate x:Key="ListViewItemTemplate1" x:DataType="x:String">
     <Grid>
         <Image Source="{x:Bind}" CanDrag="True" PointerPressed="Image_PointerPressed" DragStarting="Image_DragStarting" />
     </Grid>
</DataTemplate>

并按照以下事件处理程序添加一些内容

private async void Image_PointerPressed(object sender, PointerRoutedEventArgs e)
    {            
        var image = sender as Image;
        var pointerPoint = e.GetCurrentPoint(sender as UIElement);
        var dropStatus = await image.StartDragAsync(pointerPoint);
    }

    private void Image_DragStarting(UIElement sender, DragStartingEventArgs args)
    {
        args.Data.Properties.Add("myKey", sender);
    }

还有一个处理你的放置目标的东西，比如

        private async void TargetImage_Drop(object sender, DragEventArgs e)
    {
        Image result = e.DataView.Properties["myKey"] as Image;

        TargetImage.Source = result.Source;
    }

但是，问题的核心是 scrollviewer 水平滚动和拖动操作相互干扰，以及您可能会在 PointerMoved 事件中尝试的典型变通方法来测试移动是水平还是垂直direction 不容易实现，因为 ScrollViewer 会吞下大部分 PointerMoved 事件，如下所述:https://blogs.msdn.microsoft.com/wsdevsol/2013/02/15/where-did-all-my-gestures-go/

因此，根据您最终的用户体验，您可能会尝试断开拖动和滚动这两个用户交互。例如，您可以在 ListView 的两端放置左右滚动按钮，为用户提供滚动列表的方式，并保留与 ListView 的直接触摸交互以触发拖动操作。

像下面这样的代码可以用来向左滚动

        private void ScrollLeftButton_Click(object sender, RoutedEventArgs e)
    {
        Border border = VisualTreeHelper.GetChild(ImageListview, 0) as Border;
        ScrollViewer scrollViewer = border.Child as ScrollViewer;
        scrollViewer.HorizontalScrollMode = ScrollMode.Enabled;
        scrollViewer.ChangeView(scrollViewer.HorizontalOffset + 100, null, null);
        scrollViewer.HorizontalScrollMode = ScrollMode.Disabled;
    }

另一种选择可能是引入两种交互模式，通过一个按钮打开和关闭滚动模式。当 scrollOn bool 为 true 时，您不会在 PointerPressed 上启动 StartDrag，当它为 false 时，您会启动。这将使用户既可以平滑地滚动列表，也可以从列表中简单地拖动，但在任何给定的时间点只能以一种或另一种方式工作。

也许根据您尝试为用户提供的特定体验，您或许可以想出其他方法来为您的用户分离这两种交互。

HTH.