WinUI3 C++桌面应用：如何在Drop事件中获取被拖拽的UIElement

核心思路 #

通过DragStarting事件将被拖拽的UIElement存入DataPackage，在Drop事件中从DataPackage取出该元素，以此实现事件间的数据传递。

1. 为拖拽源（TextBox）注册DragStarting事件并存储元素 #

在TextBox的DragStarting事件处理函数中，将当前TextBox实例存入DragData的自定义格式字段：

void MainWindow::TextBox_DragStarting(winrt::Microsoft::UI::Xaml::UIElement const& sender, winrt::Microsoft::UI::Xaml::DragStartingEventArgs const& e)
{
    // 转换为具体的TextBox类型
    auto draggedTextBox = sender.as<winrt::Microsoft::UI::Xaml::Controls::TextBox>();
    
    // 自定义数据格式标识，用于后续精准取出
    winrt::hstring customFormat = L"DraggedUIElement";
    
    // 将TextBox实例存入DataPackage
    e.Data().SetData(customFormat, draggedTextBox);
    
    // 设置允许的拖拽操作类型
    e.AllowedOperations(winrt::DataPackageOperation::Move);
}

同时确保TextBox开启拖拽支持：

<TextBox AllowDrop="True" DragStarting="TextBox_DragStarting" />

2. 在Canvas的Drop事件中取出被拖拽的UIElement #

在Canvas的Drop事件处理函数中，通过自定义格式从DragData中提取目标元素：

void MainWindow::Canvas_Drop(winrt::Microsoft::UI::Xaml::UIElement const& sender, winrt::Microsoft::UI::Xaml::DragEventArgs const& e)
{
    auto targetCanvas = sender.as<winrt::Microsoft::UI::Xaml::Controls::Canvas>();
    winrt::hstring customFormat = L"DraggedUIElement";
    
    // 检查DataPackage是否包含自定义格式的数据
    if (e.Data().Contains(customFormat))
    {
        // 取出并转换为TextBox类型
        auto draggedElement = e.Data().GetData(customFormat).as<winrt::Microsoft::UI::Xaml::Controls::TextBox>();
        
        if (draggedElement)
        {
            // 示例：将TextBox添加到Canvas，并设置拖拽落点位置
            auto dropPos = e.GetPosition(targetCanvas);
            winrt::Microsoft::UI::Xaml::Controls::Canvas::SetLeft(draggedElement, dropPos.X);
            winrt::Microsoft::UI::Xaml::Controls::Canvas::SetTop(draggedElement, dropPos.Y);
            
            // 若为移动操作，需先从原父容器移除元素
            auto parentPanel = winrt::Microsoft::UI::Xaml::Media::VisualTreeHelper::GetParent(draggedElement).as<winrt::Microsoft::UI::Xaml::Controls::Panel>();
            if (parentPanel)
            {
                parentPanel.Children().Remove(draggedElement);
            }
            
            targetCanvas.Children().Append(draggedElement);
        }
    }
}

同样确保Canvas开启接受拖拽：

<Canvas AllowDrop="True" Drop="Canvas_Drop" />

关键注意点 #

• 该方案仅适用于同一应用内的拖拽，跨进程拖拽需使用文件或其他序列化数据格式。
• 若拖拽操作涉及元素生命周期管理，可使用winrt::weak_ref存储元素，避免悬垂引用（短时间拖拽场景一般无需）。

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