Android Drag and Drop

Android Drag and Drop

Android drag/drop framework allows your users to move data from one View to another View in the current layout using a graphical drag and drop gesture.

Although the framework is primarily designed for data movement, you can use it for other UI actions. For example, you could create an app that mixes colors when the user drags a color icon over another icon.

NOTE: You will need to set a minimum SDK version of 11 to use the drag and drop processing.

The Drag & Drop Process

There are basically four steps or states in the drag and drop process −

  • STARTED : This event occurs when you start dragging an item in a layout, your application calls startDrag() method to tell the system to start a drag. The arguments inside startDrag() method provide the data to be dragged, metadata for this data, and a callback for drawing the drag shadow.The system first responds by calling back to your application to get a drag shadow. It then displays the drag shadow on the device.Next, the system sends a drag event with action type ACTION_DRAG_STARTED to the registered drag event listeners for all the View objects in the current layout.To continue to receive drag events, including a possible drop event, a drag event listener must return true, If the drag event listener returns false, then it will not receive drag events for the current operation until the system sends a drag event with action type ACTION_DRAG_ENDED.
  • CONTINUING : The user continues the drag. System sends ACTION_DRAG_ENTERED action followed by ACTION_DRAG_LOCATION action to the registered drag event listener for the View where dragging point enters. The listener may choose to alter its View object’s appearance in response to the event or can react by highlighting its View.The drag event listener receives a ACTION_DRAG_EXITED action after the user has moved the drag shadow outside the bounding box of the View.
  • DROPPED : The user releases the dragged item within the bounding box of a View. The system sends the View object’s listener a drag event with action type ACTION_DROP.
  • ENDED : Just after the action type ACTION_DROP, the system sends out a drag event with action type ACTION_DRAG_ENDED to indicate that the drag operation is over. Here you can display any Toast messages.

Drag Event Listener and Callback Method

The DragEvent represents an event that is sent out by the system at various times during a drag and drop operation. This class provides few Drag Events and important methods which we use during Drag/Drop process.

Following are all events integers available as a part of DragEvent class.

Drag EventMeaning
ACTION_DRAG_STARTEDSignals the start of a drag and drop operation.
ACTION_DRAG_ENTEREDSignals to a View that the drag point has entered the bounding box of the View.
ACTION_DRAG_LOCATIONSent to a View after ACTION_DRAG_ENTERED if the drag shadow is still within the View object's bounding box.
ACTION_DRAG_EXITEDSignals that the user has moved the drag shadow outside the bounding box of the View.
ACTION_DROPSignals to a View that the user has released the drag shadow, and the drag point is within the bounding box of the View.
ACTION_DRAG_ENDEDSignals to a View that the drag and drop operation has concluded.

Example

In this tutorial, we will implement a drag-and-drop operation with TextView, ImageView and Button.

VIDEO DEMO

1. Create a new project in Android Studio by navigating to File ⇒ New ⇒ New Project and fill required details. By default my activity is MainActivity.java.

2. Open your activity_main.xml layout and place the below code to it. The layout contains three Linear Layout which will received dragged view.

3. This point will shows step-by-step how to start a drag, how to respond to events during the drag, how respond to a drop event, and how to end the drag and drop operation.

  • Starting a drag :

The user starts a drag with a drag gesture, usually a long press, on a View object. In response, you should do the following:

As necessary, create a ClipData and ClipData.Item for the data being moved. As part of the ClipData object, supply metadata that is stored in a ClipDescription object within the ClipData. For a drag and drop operation that does not represent data movement, you may want to use null instead of an actual object.

If you want to learn about ClipData then refer to this link.

For example, this below code snippet shows how to respond to a long press on a View by creating a ClipData object that contains the tag or label of an View.

Dragging Button

Dragging Button

  • Responding to a drag events : 

All drag events are initially received by your drag event method or listener. The following code snippet is a simple example of reacting to drag events in a listener:

After Dropping Button/View

After Dropping Button/View

4. Finally open up your MainActivity.java and place the below code to it. This class will contain all the drag and drop steps that we learned from the above step,

5. Finally all done, now you can also add Drag and Drop functionality to your apps.

Thanks. :)

Download Source Code – >

About the author

I am an Android developer for whom Android is the one and only love. I work as a freelancer which gets me and Android closer. I always love to share my learnings and love to learn from others knowledge too.

COMMENTS (2)
Reply

Hi!
Thank you for the tutorial on drag and drop.

I am learning android programming. I am Sudanese but I live and work in KSA. I teach English in a private institute. I write programs that convert the English exercise in the textbook into interactive mobile apps to be installed on my students mobile phones. Sometimes I get stuck. That’s why I need a mentor. If you can help, let me know so that we can agree on a price and a method of payment. If you are not interested, please recommend someone who can help me when I get stuck.

    Hi Eltayeb,

    Yes, I am interested. Can you drop me a mail at surender@androhub.com. So that we can discuss the things more comfortably.

    Thanks

Leave a Comment

Comment (required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Name (required)
Email (required)