Performing Drag&Drop Operations

November 2005

Objectives

• Understand drag&drop operations with Collector controls

Contents

Introduction

Beginning a drag&drop operation

Accepting data from a drag operation

Converting documents into toolwindows and vice versa

Conclusion

Introduction

This article shows how to use the drag&drop operations with LidorSystems.Collector controls. You can drag&drop Bar, Group and Page controls (which are part of LidorSystems.Collector library) in design-time and run-time. In design-time you can quickly and easily adjust your controls and create desired layout. With these operations you can not only move controls from one place to another, but also you can dock them  to any side of the drop zone (whether it is a Control or Form object), or you can create floating windows.

Each control in LidorSystems.Collector library has unique abillities, connected in a way to create strong and flexible hierarchy. They are in detail explained in the Description of Collector controls article.

Beginning a drag&drop operation

Drag&Drop operations can be started from different places depending of structure you have created with use of Bar, Group and Page control. Mainly drag operation can be started from header of Bar and Group control, or from tab of the Group and Page control. The Bar, Group and Page control for clarification in the following text will be named as drag object.

 

To begin a drag&drop operation you need to press and hold left mouse button on drag object and move the cursor in any direction to detach drag object from his container. This will raise the BarDragging, GroupDragging or PageDragging event (depends of the type of drag object). Events is raised in the following manner:

• BarDragging - event is raised only when you start drag operation from the header of the Bar control.
• GroupDragging - event is raised when you start drag operation from the header of the Group control or from the group tab when the Bar control has horizontal appearance.
• PageDragging - event is raised when you start drag operation from the page tab.

Drag operation can be halted if you set the AllowDrag property value to False. Also, if you handle these events you can prevent drag operation to continue. The following code presents GroupDragging event; this applies also for other two events mentioned above:

[Visual Basic]
Private Sub Group1_GroupDragging(ByVal sender As Object, _
   ByVal ce As LidorSystems.Collector.CancelableCollectorEventArgs) Handles Group1.GroupDragging
   ce.Cancel = true
End Sub

[C#]
private void group1_GroupDragging(object sender, LidorSystems.Collector.CancelableCollectorEventArgs ce)
{
   ce.Cancel = true;
}

When you drag object the cursor will change to represent the object that is dragged (there are three different cursors for each control). Also drop zone is shown with shape set from DockHintStyle property. This property can have three different values: RubberBand, TranslucentClone and TranslucentFill.

 

While moving the drag object you will notice that drop zone will change showing the destination where drag object will drop. While dragging, the GroupDragOver event is raised  with parameters holding the drag object, mouse position and permission to drop the object to the destination. You can handle this event to check the dragging object and whether it is allowed to drop to the destination. The following code check whether the drag object is Group control and if it is, it displays a message in the caption of the Form describing the Group control, whether can be dropped to the destination, and the location where it will be dropped. You can handle this event to decide programmatically where the drag object can be dropped.

[Visual Basic]
Private Sub Group1_GroupDragOver(ByVal sender As Object, _
   ByVal de As LidorSystems.Collector.CollectorDragEventArgs) Handles Group1.GroupDragOver
   If (TypeOf de.CollectorObject Is Group) Then
      Me.Text = CType(de.CollectorObject, Group).Text + " - AllowDrop (" + de.AllowDrop.ToString() + "), Location (" + de.X.ToString() + ", " + de.Y.ToString() + ")"
   End If
End Sub

[C#]
private void group1_GroupDragOver(object sender, LidorSystems.Collector.CollectorDragEventArgs de)
{
   if (de.CollectorObject is Group)
      this.Text = ((Group)de.CollectorObject).Text + " - AllowDrop (" + de.AllowDrop.ToString() + "), Location (" + de.X.ToString() + ", " + de.Y.ToString() + ")";
}

Note   The type of CollectorObject can be either Bar, Group or Page control.

 

Accepting data from a drag operation

Depending of the drop zone (whether is CollectorObject or some other control), drag object can be dropped or docked to one side of the target control. Because of the strong hierarchy among Collector controls, drag object can be accepted by control which is one level up in heirarchy; this means that:

• Bar control can only be docked to one side of the target control
• Group control can be accepted by Bar control and another Group control. If the drop zone is Bar control then reordering of groups can occur; if the drop zone is Group control then pages from the source Group will be merged with pages from the targeted Group control
• Page control can be accepted only by Group control. This way you can reorder tabs.

To designate the drop zone you must set the DropAllowed property of the target control to True.

When the drag object is dropped to the drop zone, the following events are raised: BarDropped, GroupDropped and PageDropped (depending of the type of drag object). The following code check whether the drop object is Group control and if it is, it displays a message in the caption of the Form describing the Group control:

[Visual Basic]
Private Sub Group1_GroupDropped(ByVal sender As Object, _
   ByVal de As LidorSystems.Collector.CollectorDropEventArgs) Handles Group1.GroupDropped
   If (TypeOf de.CollectorObject Is Group) Then
      Me.Text = CType(de.CollectorObject, Group).Text 
End Sub

[C#]
private void group1_GroupDropped(object sender, LidorSystems.Collector.CollectorDropEventArgs de)
{
   if (de.CollectorObject is Group)
      this.Text = ((Group)de.CollectorObject).Text;
}

 

Converting documents into toolwindows and vice versa

In LidorSystems.Collector class library Bar, Group and Page controls can be of different ControlType. For example on your Form you may have Documents and ToolWindows. Documents are created by pages contained in the Group control which has ControlType set to Documents and tool windows are created by groups with pages contained in the Bar control which has ControlType set to ToolWindow.

While performing drag&drop operations if you want to restrict target control to accept only documents then you need to set the AcceptType property value to Documents. The same logic aplies to tool windows. But if you want target control to accept objects from both types you need to set AcceptType property value to Both. This way in container control, let say Bar control which has AcceptType property set to Both, in one moment you will have documents and tool windows in one place. To make conversion of documents to tool windows you need to set AcceptType property value to ToolWindow and automatically all documents can became tool windows. You can do this also with conversion of tool windows to documents.

This way, when designing the user interface layout you can place further restrictions where control can be dropped.

Conclusion

Drag&Drop operations are very useful when it comes to dynamically make changes in user interface layout. LidorSystems.Collector brings you to another level of management in reposition of controls in design-time and run-time, with additional restrictions in reordering, conversion, docking and floating of Collector controls.