The Infragistics Drag and Drop Framework™ library provides the necessary pieces to make it as simple as possible to add drag and drop functionality to your application. This allows for real-time moving of elements and more user friendly interactions.
You can allow an item to be dragged by setting the DragSource object’s IsDraggable property to True.
In XAML:
<StackPanel Background="White" Orientation="Horizontal">
<Border>
<Image Source="/Images/select.png" Stretch="Fill">
<ig:DragDropManager.DragSource>
<ig:DragSource IsDraggable="True" DragChannels="ChannelA"
Drop="DragSource_Drop">
</ig:DragSource>
</ig:DragDropManager.DragSource>
</Image>
</Border>
<!-- Add more elements -->
</StackPanel>
You can set the drop targets by setting the DropTarget object’s IsDropTarget property to True.
In XAML:
<StackPanel x:Name="TargetPanel" Background="White" Orientation="Vertical">
<ig:DragDropManager.DropTarget>
<ig:DropTarget IsDropTarget="True"
DropChannels="ChannelA">
</ig:DropTarget>
</ig:DragDropManager.DropTarget>
</StackPanel>
For an item to be dragged onto a drop target, both the source and target must belong to the same drag and drop channel. For more information, see Set Drag and Drop Channels. If the DragChannels and DropChannels properties are not set, a default channel is used.
Just as the Drag operation is initiated, a snapshot image of the element to be dragged is captured and stored in an internally created instance of the DragObject, which is set as the DataContext of the internally managed ContentControl.
Also the ContentControl.ContentControlTemplate is set to the DragSource object’s DragTemplate property.
The DragObject object exposes two properties:
Data – this property gets an instance of the object that represents the dragged data. This object is set through the DragSource.DataObject or the result of DragSource.DataObjectBinding if it is set.
DragImage – this property gets the image that represents the snapshot of the UIElement that initiated the drag and drop operation.
The following code demonstrates how to assign a data template to the DragSource object’s DragTemplate property.
In XAML:
<DataTemplate x:Key="itemsTemplate">
<StackPanel Background="#FFC1C1C1" Orientation="Horizontal">
<TextBlock Text="{Binding Data.Description}" />
<ContentControl Content="{Binding Path=DragImage}"/>
</StackPanel>
</DataTemplate>
In above example we are assuming that the object assigned to the DragObject.Data property has a property Description.
While the item is being dragged, the underlying visual tree is inspected for appropriate drop targets. When the drop target is found the framework provides a visual indication by drawing a semitransparent shape over the drop target. You can set the color of this shape by setting the DropTarget object’s DropTargetMarkerBrush property. The default color is transparent.
If your drop target has properties set inline directly on the property itself, the properties you set in the DropTargetStyle will not affect the drop target. If you want the DropTargetStyle’s property settings to override the ones set on the DropTarget, instead of setting them inline, use a style on the DropTarget.