Xamarin.Forms无拖拽完成事件，元素释放至非拖放区无法恢复可见问题

核心思路 #

Xamarin.Forms的DragGestureRecognizer其实提供了DragCompleted事件——这个事件会在任何拖拽操作结束时触发，不管是成功Drop到目标区域，还是拖到无Drop识别器的区域、甚至系统状态栏这类App外部区域。我们可以利用这个事件，配合一个标记位来判断是否需要恢复元素的可见性。

实现步骤 #

1. 给拖拽元素绑定拖拽事件：在XAML或代码中为需要拖拽的元素添加DragGestureRecognizer，绑定DragStarting和DragCompleted事件。
2. 标记拖拽状态：用一个布尔变量记录是否成功完成Drop操作。
3. 处理Drop事件：在目标区域的Drop事件中标记“成功Drop”。
4. 在DragCompleted中恢复可见性：如果未成功Drop，就恢复元素的可见性。

代码示例 #

XAML部分

<!-- 拖拽元素 -->
<Label x:Name="DragElement" Text="可拖拽元素" IsVisible="True">
    <Label.GestureRecognizers>
        <DragGestureRecognizer 
            DragStarting="DragElement_DragStarting"
            DragCompleted="DragElement_DragCompleted"/>
    </Label.GestureRecognizers>
</Label>

<!-- Drop目标区域 -->
<Frame BackgroundColor="LightGray" Padding="20">
    <Frame.GestureRecognizers>
        <DropGestureRecognizer Drop="DropTarget_Drop"/>
    </Frame.GestureRecognizers>
    <Label Text="Drop到这里"/>
</Frame>

后台代码部分

private bool _isDroppedSuccessfully;

private void DragElement_DragStarting(object sender, DragStartingEventArgs e)
{
    var element = sender as VisualElement;
    // 拖拽开始时隐藏元素
    element.IsVisible = false;
    // 重置成功标记
    _isDroppedSuccessfully = false;
    // 可选：传递拖拽的数据（如果是绑定集合的项，可传递绑定对象）
    e.Data.Properties["DragData"] = element.BindingContext;
}

private void DropTarget_Drop(object sender, DropEventArgs e)
{
    // 处理Drop逻辑：比如将元素添加到目标集合
    if (e.Data.Properties.TryGetValue("DragData", out var dataObj))
    {
        // 示例：假设目标是一个ObservableCollection
        TargetCollection.Add(dataObj as YourDataModel);
        // 标记为成功Drop
        _isDroppedSuccessfully = true;
    }
}

private void DragElement_DragCompleted(object sender, DragCompletedEventArgs e)
{
    var element = sender as VisualElement;
    // 如果未成功Drop，恢复元素可见性
    if (!_isDroppedSuccessfully)
    {
        element.IsVisible = true;
    }
    // 重置标记，避免影响下次拖拽
    _isDroppedSuccessfully = false;
}

针对集合绑定元素的优化 #

如果拖拽的是ListView/CollectionView这类控件的项，建议通过MVVM方式绑定IsVisible属性，而不是直接操作UI元素：

1. 给数据模型添加IsVisible属性：

public class YourDataModel : INotifyPropertyChanged
{
    private bool _isVisible = true;
    public bool IsVisible
    {
        get => _isVisible;
        set
        {
            _isVisible = value;
            OnPropertyChanged();
        }
    }

    // 实现INotifyPropertyChanged接口...
}

2. 修改拖拽事件逻辑：

private void DragElement_DragStarting(object sender, DragStartingEventArgs e)
{
    var element = sender as VisualElement;
    var dataItem = element.BindingContext as YourDataModel;
    dataItem.IsVisible = false;
    _isDroppedSuccessfully = false;
    e.Data.Properties["DataItem"] = dataItem;
}

private void DragElement_DragCompleted(object sender, DragCompletedEventArgs e)
{
    var element = sender as VisualElement;
    var dataItem = element.BindingContext as YourDataModel;
    if (!_isDroppedSuccessfully)
    {
        dataItem.IsVisible = true;
    }
    _isDroppedSuccessfully = false;
}

这种方式更符合Xamarin.Forms的MVVM设计理念，也能避免直接操作UI带来的问题。

内容的提问来源于stack exchange，提问作者Олег Белов