How to use Multi-touch in Android 2: Part 5, Implementing the Drag Gesture

How to use Multi-touch in Android 2: Part 5, Implementing the Drag Gesture

Summary: This will probably get lost in all of today's iPad coverage, but it's time for another entry in the Android multi-touch series. In this part we fill in the touch event code to let us drag an image around on the screen. Next week we'll tie everything together by implementing the multi-touch pinch zoom gesture.

SHARE:
TOPICS: Hardware
11

This will probably get lost in all of today's iPad coverage, but it's time for another entry in the Android multi-touch series. In this part we fill in the touch event code to let us drag an image around on the screen. Next week we'll tie everything together by implementing the multi-touch pinch zoom gesture. All source code can be downloaded from the web site for Hello, Android! (3rd edition).

Implementing the Drag Gesture

A drag gesture starts when the first finger is pressed to the screen (ACTION_DOWN) and ends when it is removed (ACTION_UP or ACTION_POINTER_UP).

From: Touchv1/src/org/example/touch/Touch.java:

switch (event.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
savedMatrix.set(matrix);
start.set(event.getX(), event.getY());
Log.d(TAG, "mode=DRAG" );
mode = DRAG;
break;
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
Log.d(TAG, "mode=NONE" );
break;
case MotionEvent.ACTION_MOVE:
if (mode == DRAG) {
matrix.set(savedMatrix);
matrix.postTranslate(event.getX() - start.x,
event.getY() - start.y);
}
break;
}
When the gesture starts we remember the current value of the transformation matrix and the starting position of the pointer. Every time the finger moves, we start the transformation matrix over at its original value and call the postTranslate( ) method to add a translation vector, the difference between the current and starting positions.

If you run the program now you should be able to drag the image around the screen using your finger. Neat, huh?

Joe Asks: Why not use the built-in gesture library?

The android.gesture package provides a way to create, recognize, load, and save gestures. Unfortunately it is not very useful in practice. Among other problems, it doesn’t come with a standard collection of built-in gestures (like tap and drag) and it doesn’t support multi-touch gestures such as pinch zoom. Perhaps a future version of Android will include a better gesture library so the code in this chapter could be simplified.

Continued in Part 6, Implementing the Pinch Zoom Gesture >

Copyright notice: This is an excerpt from Hello, Android 3rd edition, published by the Pragmatic Bookshelf. For more information or to purchase a paperback or PDF copy, please visit http://www.pragprog.com/titles/eband3.

Copyright © 2010 The Pragmatic Programmers, LLC. All rights reserved.

No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form, or by any means, electronic, mechanical, photocopying, recording, or otherwise, without the prior consent of the publisher.

Topic: Hardware

Ed Burnette

About Ed Burnette

Ed Burnette is a software industry veteran with more than 25 years of experience as a programmer, author, and speaker. He has written numerous technical articles and books, most recently "Hello, Android: Introducing Google's Mobile Development Platform" from the Pragmatic Programmers.

Kick off your day with ZDNet's daily email newsletter. It's the freshest tech news and opinion, served hot. Get it.

Talkback

11 comments
Log in or register to join the discussion
  • Something education on ZDNet?

    Really appreciate this post. Just about every other post incites flame wars and nonsense that isn't worth my time reading.
    davidr69
    • Thanks

      It's good to know somebody finds them useful. Unfortunately the educational posts get far fewer page views than the controversial ones.

      Now if I could just learn to count. 1, 2, 3, 4, ... uh, 5 yeah. Reminds me of an old post:

      http://blogs.zdnet.com/Burnette/?p=323

      "Five is right out"
      Ed Burnette
  • RE: How to use Multi-touch in Android 2: Part 6, Implementing the Drag Gest

    android.gesture is mostly to recognize shapes. To recognize
    scrolls, flings, etc. you can use the GestureDetector. FroYo
    will add a new detector class to recognize "pinch-zoom"
    easily.
    thinthalion
    • Good to hear

      I'm glad this will be addressed in FroYo. By the way I need another technical reviewer for Hello, Android 3e. Send me an email if you can do it.
      Ed Burnette
  • RE: How to use Multi-touch in Android 2: Part 6, Implementing the Drag Gesture

    Hi Ed,

    Great post. It's what I was looking for :) I've
    implemented this code as saw that the image may be moved
    only in its image view. Is there a way to move an image
    among various views? Thanks.
    c90
  • How to use Multi-touch in Android 2: Part 5, Implementing the Drag Gesture

    hi there.
    this is really a great post to learn to program and recognize the gesture.
    however i got stuck when in part 5:
    what is the start variable?
    please advise.
    thanks.
    calvinlyp
    • I know the answer

      @calvinlyp hi, I've bought the book and I'm sure that the author must have missed three declarations. And they are PointF start = new PointF();
      PointF mid = new PointF();
      float oldDist = 1f;
      which are just below the sentence "int mode = NONE;"
      Hope that can help you?
      yestbag
  • RE: How to use Multi-touch in Android 2: Part 6, Implementing the Drag Gesture

    Thank you for such a thoughtful and easy-to-understand explanation about multi-touch. Most of the other blogs are difficult, and condescending. I'm off to buy the book!
    Lesismore
  • what is start veriable in start.set(event.getX(), event.getY())

    please help me about this topic. it is a fault in my project. i followed all the instructions and did them. but i got a problem about start...
    serefakyuz.com
  • what is start veriable in start.set(event.getX(), event.getY())

    please help me about this topic. it is a fault in my project. i followed all the instructions and did them. but i got a problem about "start"...
    serefakyuz.com
  • how do i can move two ImageView?

    Hello, recently I start with multitouch. I have two within a RelativeLayout ImageView, I wish you both can move independently. The problem is that ontouch always takes the same view with the same event. I can change the View but not the event. How do can I do to make me take the event View I'm playing? Sorry for my English
    morche09