This is a migrated thread and some comments may be shown as answers.

Drag between TileViews and drop TileViewItem in middle of target collection.

1 Answer 83 Views
TileView
This is a migrated thread and some comments may be shown as answers.
Greg
Top achievements
Rank 1
Greg asked on 08 Oct 2014, 12:57 AM
I would like to know if it is possible to drag a TileViewItem from one TileView to another and drop the dragged TileViewItem in the middle of the collection of the second TileView's items. (I am using MVVM with ObservableCollections populating both tileviews, using DragDropManager for dragging.)

In other words - how do I determine what TileViewItem in the second TileView is the target of the drop action?

Example: TileView 1 has 10 items, TileView2 has 20 items. I want to drag TileView1 position #5 to TIleView2 position # 12.

All the examples I found on the forum demonstrate dropping the TileViewItem in the last position of the target TileView - that's easy.

Thanks in advance.

1 Answer, 1 is accepted

Sort by
0
Martin Ivanov
Telerik team
answered on 08 Oct 2014, 02:16 PM
Hi Greg,

To determine the RadTileViewItem under the mouse (the drop target) you can use the e.OriginalSource of the drop event arguments and then get its RadTileViewItem parent with the ParentOfType<T>() extension method.

private void OnTileViewDrop(object sender, Telerik.Windows.DragDrop.DragEventArgs e)
{
    var originalSource = e.OriginalSource as FrameworkElement;
    var dropTarget = originalSource.ParentOfType<RadTileViewItem>();   
}
In this case the OriginalSource property contains the element that is directly under the mouse which is a child of the hovered tile view item.

Then based on the drop target you can insert the item in your collection. However, keep in mind that when you reorder the items in the tileview with drag, they are not reordered in the original collection. This is why when you add an item after reorder its position might not be correct. To resolve this you can create a Position property in your view model and bind it two way to the Position property of the RadTileViewItems. Then when you insert the item you can also set its position.

For your convenience I prepared a sample project demonstrating this approach. Please give it a try and let me know if it helps.

Regards,
Martin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
TileView
Asked by
Greg
Top achievements
Rank 1
Answers by
Martin Ivanov
Telerik team
Share this question
or