[Enhancement] Support drag-and-drop reordering in CollectionView

[velocitysystems]

Summary

Support drag-and-drop reordering in CollectionView.

API Changes

public static readonly BindableProperty ReorderModeProperty;
public CollectionViewReorderMode ReorderMode { get; set; }

public enum CollectionViewReorderMode {
     Disabled,
     Enabled
}

When ReorderMode is set to Enabled, the view supports drag-and-drop reordering.
Upon dragging an item in the collection, the Move() method on the ObservableCollection<T> is called to signal the change to the dataset.

Intended Use Case

Reordering a collection of elements ie. tasks, reminders, photos, tracks in a playlist etc.

Other Notes

• Supported in iOS 9 and above+ in UICollectionView.
  https://github.com/xamarin/ios-samples/tree/master/ios9/CollectionView

• Supported on Android in RecyclerView using ItemTouchHelper.

• Supported on UWP in GridViewusing CanReorderItems="true" and ReorderMode.

[velocitysystems]

As a side note, we have built custom renderers for XF 3.3/3.4 to bring this functionality to ListView.
We currently have this supported on Android, iOS and UWP.

[velocitysystems]

@samhouts @hartez Would be happy to work on a PR for this if approved.

[bbl-Laobu]

Also: Drag and drop onto another item

Being able to drag and drop onto another item and having an event triggered that provides a references to the item that was dragged and the element that was dropped onto would be great as well.

Thus: drag item -> drop onto other item -> trigger event

Use case:

• Manually group: move item onto other item to create folder
• Move item in folder; in a collection containing both items and folders, drop items into folders... (= how file explorer works)
• Perform action when 2 items are combined (perform calculation, transform, start process...)
• ...

Having drag and drop and the corresponding event when dropping would allow a developer to do this.
Note that proper visuals will need to be present when dragging, dropping, hovering above and item...etc

[peterfournier]

@bbl-Laobu I'm working on a nuget for this feature here DragNDrop. Working on the iOS implementation now.

[adrianknight89]

I believe this should be supported by XF (i.e. no need for a separate Nuget).

[velocitysystems]

@adrianknight89 Agree

[adrianknight89]

@velocitysystems You could go ahead and submit a PR if you have it working already. I don't see a reason against this feature. I'd change the property name though. ReorderMode sounds like an enum not a boolean. Maybe try Draggable? Also, as mentioned above, it'd be nice to have proper events (DraggingStarted, Dragging, DraggingEnded, etc.) along with source and target items.

Other things to keep in mind:

• How will this work in the case of grouped items?
• Needs to be tested in linear and grid layouts
• Needs to be tested in portrait and landscape modes
• Will this be supported only by CollectionView? What about CarouselView?
• Needs to be tested with ObservableRangeCollection in addition to the typical collections/lists
• Is there a way to cancel dragging while it's in progress? Sometimes this might be needed upon UI errors or new items being added to the data source after DB fetch.
• Can drop animations be customized?

[marcojak]

This would be a great addon to a CollectionView.
Any news about it?