This is the first post in a 3 part series that is going to cover implementing Drag and Drop in an Android application.
(I am currently using version 4.0 of the sdk, but I originally wrote the code in this series with the 3.1 version.)
Why Use Drag and Drop
When I started working on my Android application, which involves moving a chess piece around a chess board, I chose to use drag and drop functionality for two reasons:
- I felt that drag and drop would get as close a possible to the experience of moving the piece around the board.
- By using drag and drop it will be much easier to determine valid moves by dropping the chess piece on an individual object (a square in the chess board in this case) rather than keeping track of the chess piece’s x,y coordinates. I’ll explain more on how I implemented this in the last installment of this series
My Drag and Drop Goals
I had 3 specific goals when it came to implementing drag and drop with regards to moving the chess piece on the board.
- When a user presses down and starts to drag, the chess piece would be replaced by a much lighter version of the original, making it obvious that it is being moved.
- I wanted to limit the area where the chess piece could be dragged, more specifically I don’t want players to drag the piece off the board
- If the player tries to drop the game piece that would result in an illegal move, I wanted the game piece to “snap back” to it’s original position.
This post is going to cover my first goal for drag and drop in my application.
Changing the ImageView on Drag Start
As I began working, I realized that the drag drop functionality did not support what I wanted right out of the box, but certainly with a little work there was enough in the api to give me what I was looking for. When the user presses down on the chess piece (which is an ImageView) to start a drag, here are the steps I take:
- Create a DragShadowBuilder object.
- Call the startDrag method.
- Hide the original ImageView (the chess piece) by calling setVisibility and passing in View.INVISIBLE, leaving only the DragShadowBuilder object visible, clearly indicating the drag has started.
The steps above are all done in the ImageView’s OnTouchListner object, in the implemented onTouch method. Here is the code:
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
ClipData clipData = ClipData.newPlainText("", "");
View.DragShadowBuilder dsb = new View.DragShadowBuilder(view);
view.startDrag(clipData, dsb, view, 0);
view.setVisibility(View.INVISIBLE);
return true;
} else {
return false;
}
}
Changing the chess piece image on drag start achieved!
Next post – Limiting the Drag Area, be sure to come back!
Nice tutorial . Helped me understand the basic concepts . Any idea on how to drag a view from one fragment and drop it into another fragment .?
http://stackoverflow.com/questions/15397395/drag-and-drop-between-two-fragments
hii.. actually i am developing an android app.. this app has to do some specific things..
an image will be der,, in dat positioning ll be der.. 1,2,3,4,5,6 numbers ll be given..u have to drag each number and put in the right position on the image.. if the user keeps dat on a wrong position it shudn’t accept and it shud cum back to its original position ..
can u help me with the code///??
how can i drag drop an animated ball .
after the ondrag ie on releasing the mouse the animation should start playing again
plz help
asym
May I have the sample file please? I have this assignment of interaction design. The lecturer doesn’t care even he said that we can copy and paste the source code from internet because the subject is actually about interaction design not the programming subject.
So I really need to the drag and drop thingy works. We only have 5 days to implement the high-fidelity prototype.
Thanks
Hi, this example is exactly what i need.
Just one little problem, how to save the position when close the program And reload it when start again?
Please tell me how to do this!!
Alejandro,
I’m glad you found the post useful. Saving the position on game close and reloading when starting again is a great question. To be fair, I think this topic would be better covered in a separate post, which I will be covering very soon, so stay tuned! Thanks for taking the time to comment.
Regards,
Bill
Thanks for the nice introduction into drag and drop I noticed similar content http://www.javacodegeeks.com/2011/12/android-drag-and-drop-tutorial.html?m=1 which links back to you, therefore it might be ok
Lars,
Thanks for the comments. What you saw on javacodegeeks is actually the same content from my blog, they took all 3 parts of my Android Drag Drop tutorial and combined it into one. I have an reprint agreement with them, any blog of mine they reprint has a link back to the original here.
Cheers,
Bill