Property Group : Drag Zone and Drop Zones Properties
Contents |
[edit] Using the Drag Zone and Drop Zones Properties
To achieve drag-and-drop functionality in Bungee Connect, you must use both the Drag Zone and Drop Zones properties, which interact to produce the desired drag-and-drop action. Using these properties, you can enable drag-and-drop for your end users, both within a single window and across windows provided the widows are within the same browser sesssion. To trigger functions based on drag-and-drop, use the Drag Function property.
Caveat The area taken up by a control at runtime is the size of the drop target. Normally this is not a problem, however some controls take up less space at runtime than they do at design time. A DynamicForm control (for example), when placed in a VerticalBox at design time may appear to leave enough room for a drop target. At runtime however, prior to a drop, the DynamicForm control in a VerticalBox can take up as little as 1 pixel of vertical space.
[edit] Implementing Drag-and-Drop
To implement drag-and-drop, set the Drag Zone property on a control you want to act as the source for a drag. Next, choose a control you want to act as the target for a drop from the source control, and edit the Drop Zones property on that control.
Note You can use the Drop Zones property to create multiple drop zones for a single target control. Doing so enables that control to accept drops from several different source controls.
[edit] Example
To permit dragging from a control (ex: control foo), in the Drag Zone property, assign a Name and an Action. Below, the Drag Zone Name is set to mclkeyword and the Action is set to copy.
For a different control (ex: control bar) to receive the drag action (accept the drop) from control foo, you set the Drop Zones property of control bar to the same name you used in the Drag Zone property of control foo (the control from which the drag is to occur). For example, below, the Drop Zones property is set to receive a drag from the Drag Zone defined above.
[edit] Choosing Drag-and-Drop Actions
Both the Drag Zone and Drop Zones properties provide you with three choices for determining the action of a drag-and-drop:
all Allows either a copy or a move move Restricts the drag-and-drop action to a move copy Restricts the drag-and-drop action to a copy
Caution Because the Drag Zone and Drop Zones properties together determine the interaction between controls, if you set one of these properties to move, and the other to copy, the two properties conflict. At runtime, when an end user attempts a drag-and-drop between two controls with conflicting settings, no action is taken, and the drag-and-drop fails. Drop Zone actions take precidence over Drag Zones when the properties are compatible but not matching. e.g. In the case where the Drag Zone Action is set to all and the Drop Zone Action is set to Copy; the dragged object will be copied.
Setting either the Drag Zone or Drop Zones property to all means the other property controls the action. If you set both properties to all, a drag-and-drop is interpreted as a move, except when a user uses a keyboard binding to force a copy.
[edit] Supported Controls
You can set up a drag-and-drop relationship between the following controls:
Note Specialized properties involving drag-and-drop include: Drop Label and Select on Drag Over (TabList), and Drop On Node Only (Tree).
[edit] Reference
Details of both the Drag Zone and Drop Zones properties are provided below.
[edit] Property : Drag Zone
[edit] Description
Use the Drag Zone property to provide a Name and specify a drag-and-drop Action to take for items dragged from a source control.
For possible drag actions you can specify, see Choosing Drag-and-Drop Actions above.
Caveat For the Drag Zone property to be useful, you must also add the source control's Drag Zone name to the destination control's Drop Zones property list, and choose a compatible action. If you choose an incompatible action for the destination control's Drop Zones property, at runtime, attempted drag-and-drops fail.
[edit] Property Editor Location
Behavior Tab
[edit] Data Type
Name: string
Action: Enumerated string
[edit] Default Values
| Control | Default Value | |||||
|---|---|---|---|---|---|---|
| All Controls |
|
[edit] Property : Drop Zones
[edit] Description
Use the Drop Zones property to specify the Drag Zone Names of controls you want to act as sources for data elements to be dropped onto the destination control, as well as the drag-and-drop Action to apply to those elements when a drop occurs.
Note Multiple Drop Zones can be defined to allow a single target control to accept drags from several different drag source controls.
For possible drop actions you can specify, see Choosing Drag-and-Drop Actions above.
Caveat For the Drop Zones property to be useful, you must choose an action that is compatible with the action you chose for the source control's Drag Zone property. If you choose an incompatible action for the destination control's Drop Zones property, at runtime, attempted drag-and-drops fail.
[edit] Property Editor Location
Behavior Tab
[edit] Data Type
Name: string
Action: Enumerated string
[edit] Default Values
| Control | Default Value |
|---|---|
| All Controls | <empty> |