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

问题描述

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

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

解决方法

如果您想通过单击添加按钮添加 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)。

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

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

要查看此操作的所有活动部分，我推荐用于拖放的官方 UWP 示例on GitHub。此示例的第一个场景展示了将项目从 ListView 拖拽到 rest/vcenter/vm-template/library-items，包括重新排序支持。

c#c#drag-and-drop listview listview listviewitem uwp