Image motion tween

Put problem concerning Views, Layouts and other XML-Resources (like AndroidManifest) here.

Image motion tween

Postby Manu » Tue Apr 21, 2009 3:24 pm

Hi,
I have the following problem:

In my app, users can paint with their finger a path.
An image should move on this path through the view (it's not a
straight path. The path has waves).
In flash, you call this motion tween.

Is there a way for android?
How can I implement this?

Thank you, for your answers.
Manu
Freshman
Freshman
 
Posts: 2
Joined: Tue Apr 21, 2009 3:22 pm

Top

Postby raggedtoad » Thu Apr 30, 2009 12:00 am

This is just a shot in the dark, but I'm think I know a way this can be done. First, get all the points that the user has drawn along the line in an array of some sort. After you get that array, you can use an ImageView with its built in animations to do a very quick tween animation between every point in your array. That would account for any shape of line that the user could draw, including loops, etc...

Here's a little bit of quasi-code as an example:

To get an array of points (I'm assuming you're already doing something like this to make your path), where the Point object is just a simple helper object with getters and setters:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2.  
  3.  
  4. private ArrayList <Point> points;
  5.  
  6. ...
  7.  
  8. public void onTouchEvent(MotionEvent event) {
  9.  
  10.  
  11.  
  12.     points.add(new Point(event.getX(), event.getY()));
  13.  
  14.     isNormalized = false;
  15.  
  16. }
  17.  
  18.  
Parsed in 0.032 seconds, using GeSHi 1.0.8.4


To make a tween animation, in your class that has the image you want to use set as the resource for an ImageView object, you can programatically construct an animation something like what I have below:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2.  
  3.  
  4. yourImageViewObject = new ImageView();
  5.  
  6. yourImageViewObject.setImageResource(yourImage);
  7.  
  8.  
  9.  
  10. private void tweenPointAnim() {
  11.  
  12.  
  13.  
  14. for (loop through arraylist of points) {
  15.  
  16.     Point firstPoint = pointList.get(whatever);
  17.  
  18.     Point secondPoint = pointList.get(whatever);
  19.  
  20.     Animation anim = new TranslateAnimation(firstPoint.getX(), firstPoint.getY(), secondPoint.getX(), secondPoint.getY());
  21.  
  22.     anim.setDuration(some int);
  23.  
  24.     yourImageViewObject.startAnimation(anim);
  25.  
  26. }
  27.  
  28.  
  29.  
  30. }
  31.  
  32.  
Parsed in 0.032 seconds, using GeSHi 1.0.8.4
User avatar
raggedtoad
Freshman
Freshman
 
Posts: 8
Joined: Fri Feb 06, 2009 6:04 pm

Postby Manu » Thu Apr 30, 2009 5:16 pm

Thank you for the code.

It's very helpfully.
Manu
Freshman
Freshman
 
Posts: 2
Joined: Tue Apr 21, 2009 3:22 pm

Top

Return to View, Layout & Resource Problems

Who is online

Users browsing this forum: Exabot [Bot] and 13 guests