android: move to touch location after release with libgdx/universal-tween-engine

Question

I'm learning to use libgdx with universal-tween-engine and haven't been able to figure out how to touch (or click on the desktop app) a point on the screen and have a texture move all the way to the touched location without keeping the touch or click active until the end-point is reached.

When the touch event is initiated, the animation begins and the graphic moves towards the location. The graphic will follow the finger/mouse-pointer if a touch and drag is initiated. If I touch a point, the graphic will move towards the point until the touch is released. Then it stops where it was when touch is released.

I'm looking to touch-and-release and have that graphic move to the touched point, and am probably not understanding something about the tween engine implementation. I've pasted the tweening code below.

    public void render() {

            camera.update();

            batch.setProjectionMatrix(camera.combined);
            batch.begin();
            batch.draw(texture.getTexture(), texture.getBoundingBox().x, texture.getBoundingBox().y);
            batch.end();

            Tween.registerAccessor(Plane.class, new TextureAccessor());
            TweenManager planeManager = new TweenManager();

            float newX = 0;
            float newY = 0;
            boolean animateOn = false;

            if(Gdx.input.isTouched()) {
                    newX = Gdx.input.getX();

                    newY = Gdx.input.getY();

                    animateOn = true;
            }

            if (animateOn == true && (texture.getX() != newX || texture.getY() != newY)) {
                Tween.to(texture, TextureAccessor.POSITION_XY, 10)
                    .target(newX, newY)
                    .ease(TweenEquations.easeNone)
                    .start(planeManager);

                    planeManager.update(1);

                    if (texture.getX() == newX && texture.getY() == newY) {
                        animateOn = false;
                    }
            }

    }

Originally, I had the tweening code inside the conditional for isTouched() and didn't use the newX, newY or animateOn variables. I thought using isTouched() to only set the new coordinates and animation state would then make the loop trigger the tween. The older code looked like this:

    if(Gdx.input.isTouched()) {
            newX = Gdx.input.getX();

            newY = Gdx.input.getY();

            Tween.to(texture, TextureAccessor.POSITION_XY, 10)
                .target(newX, newY)
                .ease(TweenEquations.easeNone)
                .start(planeManager);

            planeManager.update(1);
    }

I've also tried using justTouched(), but the graphic would only move very slightly toward the touched point.

I've been struggling with this for a few hours, I'd really appreciate it if anyone could point me in the right direction.

Thanks.

score 6 · Accepted Answer · answered Jul 20 '12 at 08:53

Tween.registerAccessor(Plane.class, new TextureAccessor());
TweenManager planeManager = new TweenManager();

These two lines should go in the create() method, not the render() one! Here, you're instantiating a new manager on every frame, you only need one manager, that's all, not an army of them!

Also, you need to update the manager on every frame, not just when animateOn is true, else you'll need to keep your finger pressed...

The correct code is as follows, learn from it, you'll get a better understanding of how the Tween Engine works :)

// Only one manager is needed, like a Spritebatch
private TweenManager planeManager;

public void create() {
    Tween.registerAccessor(Plane.class, new TextureAccessor());
    planeManager = new TweenManager();
}

public void render() {
    // The manager needs to be updated on every frame.
    planeManager.update(Gdx.graphics.getDeltaTime());

    camera.update();

    batch.setProjectionMatrix(camera.combined);
    batch.begin();
    batch.draw(texture.getTexture(), texture.getBoundingBox().x, texture.getBoundingBox().y);
    batch.end();

    // When the user touches the screen, we start an animation.
    // The animation is managed by the TweenManager, so there is
    // no need to use an "animateOn" boolean.
    if (Gdx.input.justTouched()) {
        // Bonus: if there is already an animation running,
        // we kill it to prevent conflicts with the new animation.
        planeManager.killTarget(texture);

        // Fire the animation! :D
        Tween.to(texture, TextureAccessor.POSITION_XY, 10)
            .target(Gdx.input.getX(), Gdx.input.getY())
            .ease(TweenEquations.easeNone)
            .start(planeManager);
    }
}

Thanks for the reply and correct answer. I'd run into memory issues when testing on my phone, and got rid of the multiple tween managers all over the place. That animateOn is for the beginning of a turn based module, I probably should have left it out of the question. Thanks for the help and the great library. — nils, Jul 23 '12 at 05:41

score 2 · Answer 2 · answered Jun 25 '12 at 03:00

I was trying to implement this behavior in the wrong way. Instead of using isTouched or justTouched(), I needed to use touchDown() from GestureListener.

I created a class that implemented GestureDetector (call it touchListener())inside of my main class (the one that implements ApplicationLisetener )in the main libgdx project and put the x and y capturing code inside of toucDown (I noticed tap() was also being triggered). I moved the tween functions (the actual tweening, the call to registerAccessor(), and the creation of the new tween manager) into the update() method of touchListener().

I added a call to touchListener()'s update function inside the render() loop of the main libgdx class.

I doubt I did this is the best way, but I hope it's helpful to someone else in the future.

It's not the best way, and actually it works because you are lucky :) You really shouldn't create a new tween manager in a touch listener. A manager is only required once in a project. It's like a Spritebatch, or a Camera. You only create one instance of them :) Have a look at my answer for the correct solution, it will guide you in using the tween engine. — Aurelien Ribon, Jul 20 '12 at 08:55

android: move to touch location after release with libgdx/universal-tween-engine

2 Answers2