如何通过拖放将列表视图项从一个列表移动到另一个列表？ UWP C#

Question

我在 UWP 应用程序中有许多列表视图，我希望能够将一个项目从一个列表视图移动到另一个列表视图

我知道 AllowDrop 或 CanDragItems 属性，并且您需要处理一些事件才能使拖放工作，尽管我不知道该怎么做。

Answer 1

如果您想通过单击添加按钮来添加 ListView 控件并在 ListView 控件之间移动项目，请检查以下代码作为示例。以下代码与官方的sample不同，它使用ObservableCollection来完成拖放操作。您可以将项目从源 ListView 拖动到目标 ListView，也可以将项目从原始目标 ListView 拖动到原始源 ListView。

您可以单击Add 按钮两次，然后添加两个带有两个项目的ListView。您可以将任何项目从任何ListView 控件拖动到另一个控件。如果要将拖动的项目保留在源ListView控件中，只需注释代码dragCollection.Remove(dragedItem as string);即可。

例如：

private ObservableCollection<string> dragCollection;
private ObservableCollection<string> dropCollection;
private object dragedItem;
private ListView dragListView;
private ListView dropListView;
……

private void AddButton_Click(object sender, RoutedEventArgs e)
{
    ListView listView = new ListView();
    listView.CanDragItems = true;
    listView.CanDrag = true;
    listView.AllowDrop = true;
    listView.ReorderMode = ListViewReorderMode.Enabled;
    listView.CanReorderItems = true;
    listView.ItemsSource = new ObservableCollection<string>() { "item1","item2" };
    listView.DragItemsStarting += ListView_DragItemsStarting;
    //listView.DropCompleted += ListView_DropCompleted;
    listView.DragEnter += ListView_DragEnter;
    listView.Drop += ListView_Drop;
    listView.DragOver += ListView_DragOver;
    listView.BorderBrush = new SolidColorBrush(Colors.Red);
    listView.BorderThickness = new Thickness(1);

    stackPanel.Children.Add(listView);
}

private void ListView_DragOver(object sender, DragEventArgs e)
{
    e.AcceptedOperation = DataPackageOperation.Move;
}

private void ListView_Drop(object sender, DragEventArgs e)
{
    dropListView = sender as ListView;
    if(dropListView!=null)
    {
        dropCollection = dropListView.ItemsSource as ObservableCollection<string>;
        if (dragedItem != null)
        {
            dropCollection.Add(dragedItem as string);
            //If you need to delete the draged item in the source ListView, then use the following code
            dragCollection.Remove(dragedItem as string);
            dragedItem = null;
        }
    }
}

private void ListView_DragEnter(object sender, DragEventArgs e)
{
    e.AcceptedOperation = (e.DataView.Contains(StandardDataFormats.Text) ? DataPackageOperation.Move : DataPackageOperation.None);
}

private void ListView_DropCompleted(UIElement sender, DropCompletedEventArgs args)
{
    var listView = sender as ListView;
    if (listView != null)
    {
        dropListView = listView;
        dropCollection = listView.ItemsSource as ObservableCollection<string>;

        if(dropListView==dragListView)
        {
            return;
        }
    }

}

private void ListView_DragItemsStarting(object sender, DragItemsStartingEventArgs e)
{
    var listView = sender as ListView;
    if(listView!=null)
    {
        dragListView = listView;
        dragCollection = listView.ItemsSource as ObservableCollection<string>;

        if (dropListView == dragListView)
        {
            return;
        }
        if(e.Items.Count==1)
        {
            dragedItem = e.Items[0];
            e.Data.RequestedOperation = Windows.ApplicationModel.DataTransfer.DataPackageOperation.Move;
        }
    }
}

更多关于拖拽的信息可以参考文档(https://docs.microsoft.com/en-us/windows/uwp/design/input/drag-and-drop)。

对代码有任何疑问，请随时与我联系。

Answer 2

要实现拖动，必须在源ListView 上设置CanDragItems，在目标ListView 上设置AllowDrop。然后，您必须处理源列表上的DragItemsStarting 事件。在此处理程序中，您可以将拖动的数据存储在 DragItemsStartingEventArgs.Data 属性中。之后，您处理目标列表上的Drop 事件并使用DragEventArgs.DataView 从DataPackage 检索存储的项目值。

要查看此操作的所有移动部分，我推荐官方 UWP 拖放示例，可在on GitHub 获得。此示例的第一个场景显示将项目从 ListView 拖放到 ListView，包括重新排序支持。