Drag and Drop tab

The Drag and Drop tab in the Properties dialog box allows you to make the selected object either a drag object and/or a drop zone. Once an object has become a drag object or a drop zone, you can use the Drag and Drop triggers to make things happen.

To edit the Drag and Drop tab settings:

  1. Use the This object can be dragged option if you want to make this object a drag object.

Note:
The user can drag an object by holding down the left mouse button as they drag the object. (see also This Object Dropped Trigger for more information).

  1. Use the Return to original position if not dropped option if you want the drag object to return to its initial starting point on screen. By default this option is selected, however, it will only apply if the This object can be dragged option is ticked.

Note:
This option is normally used if you are using drop zones on the same page. If the object is not dropped into a zone, the object will return to its original position – this is useful to show the user that an object cannot be dropped or has been rejected from a drop zone. (see also Drop Refused Trigger for more information).

  1. Use the This object can have other objects dropped onto it option if you want to make this object a drop zone.

Note:
The other options in this panel allow you to set properties of the drop zone – see points 4 to 9 below for more information.

  1. Use the any draggable object option in the Droppable objects panel if any of the drag objects on the page can be dropped on this drop zone. By default, this option is selected.

Note:
Often you will want any drag object to be dropped into a drop zone, for example, if you are using the drag and drop feature to create a question, you will want to both the correct and incorrect answers (i.e. the drag objects) to be dropped so you can add or deduct points from a score.

  1. Use the these selected objects only option in the Droppable objects panel if you want to specify which drag objects on the page can be dropped into this drop zone. When this option is selected, the Object List will become active – this contains a list of all the objects on the current page. Tick the box beside the name of the objects in this list that can be dropped into this drop zone.

Note:

Drag objects that are selected in the Object List will activate an Object Dropped trigger – see Object Dropped Trigger for more information.

Drag objects that are NOT selected in the Object List will activate a Drop Refused trigger – see Drop Refused Trigger for more information.

  1. Use the Objects can be dragged off once dropped option in the Options panel if you want users to be able to remove drag objects from a drop zone. You may want to do this so that the user can move the objects to a different drop zone or to return to their original position.

Note:
If this option is not selected, then once a drag object has been dropped into this drop zone, it remains there and cannot be dragged to a new place. (see Dropped Object Removed Trigger for more information).

  1. Use the Object must fit inside drop zone option in the Options panel if the drag object must be smaller than the drop zone. With this option on the object must not be wider or higher than the object on to which it is dropped. In other words it must fit within the bounding box of the object it is to be dropped on. By default, this option is selected.

Note:
This option might be useful where the drop must be quite precise; otherwise it should be off as it can restrict what objects you can use.

  1. A drop down list is now provided for you to specify how the dropped objects should be arranged if more than one is dropped onot the drop zone. Use the Arrange dropped objects to centre option in the Options panel if you want the drag object to be tiled on top of one another or alongside each other depending on the proportions of the drop zone. By default, this option is selected. Use the Centre Dropped Object if you want the object centred in the drop zone. This option is particularly useful if you are only dropping one object into a drop zone. Alternatively you can set the objects to simple stay where they are dropped by selecting the Objects Remain Where Dropped option.

  2. Use the Limit Number of dropped objects option in the Options panel if you want to specify the maximum number of drag objects that can be placed in a drop zone. Use the spin buttons in the Maximum box to set the number of drag objects allowed in the drop zone.

Note:
When the maximum number of objects are dropped the next drag object dropped into the drop zone will be refused. (see Drop Zone Full Trigger for more information).

  1. When you have a drop zone which you have to set to be limited to one object you can also decide to force a dropped object to replace the existing one, essentially swapping itself for the incumbent object.. Simply select the Replace Dropped Object option to set this. This is useful for re-ordering objects which are already in place.

  2. A powerful feature of the drag and drop functionality is that you can reset the Drag and Drop state when the page is revisited, This means your user can come back to the drag and drop page and change their mind about what they want without having to redo the page entirely. Simply select the Restore Drag and Drop on Page Revisit option to set this.

  3. Click on the Apply button to save your changes.

Note:
It is possible that an object can be both a drag object and a drop zone. Also, the Drag and Drop triggers allow you to start a list of actions depending on a number of user actions, for example: when a user drops an object; when an object is refused from a drop zone; when a drop zone is full; and more – this level of flexibility provides you with many different uses for the drag and drop feature.

Related Topics:

Introducing Drag and Drop

Introducing the Drag and Drop triggers

The Drag and Drop states