1

I'm trying to develop a very simple game using libGDX with boxes (so 3D game) moving and rotating.

I have almost everything ready, but I'm not able to animate my boxes. I mean, when I touch the screen, I'd like my cube to move to the right by rotating 90 degrees and translating 1 (unit) to the right. As result, the right side of the box will be the new base, the old base will be in the left side, and the box is moved to the right.

So, the question is: now that I have the move set correctly (I or at least I hope so), but change is applied immediately; so how can I see the animation between first position and second position ?

Only reference to animation for 3D objects in documentation is about using obj files from blender (and similar), and for movement I need I do not consider it necessary.

Can anybody provide me some help? Thanks in advance!!

teobais
  • 2,820
  • 1
  • 24
  • 36
Alex_ES
  • 205
  • 2
  • 15

1 Answers1

1

You can do that something like this:

public static class YourAnimation {
    public ModelInstance instance;
    public final Vector3 fromPosition = new Vector3();
    public float fromAngle;
    public final Vector3 toPosition = new Vector3();
    public float toAngle;
    public float speed;
    public float alpha;
    private final static Vector3 tmpV = new Vector3();

    public void update(float delta) {
        alpha += delta * speed;
        if (alpha >= 1f) {
            alpha = 1f;
            // TODO: do whatever you want when the animation if complete
        }
        angle = fromAngle + alpha * (toAngle - fromAngle);
        instance.transform.setToRotation(Vector3.Y, angle);
        tmpV.set(fromPosition).lerp(toPosition, alpha);
        instance.transform.setTranslation(tmpV);
    }
}

YourAnimation animation = null;

void animate(ModelInstance instance) {
    animation = new YourAnimation();
    animation.instance = instance;
    animation.instance.transform.getTranslation(animation.fromPosition);
    animation.toPosition.set(animation.fromPosition).add(10f, 10f, 10f);
    animation.fromAngle = 0;
    animation.toAngle = 90f;
    animation.speed = 1f; // 1 second per second
    animation.alpha = 0;
}

public void render() {
    final float delta = Math.min(Gdx.graphics.getDeltaTime(), 1/30f);
    if (animation != null)
        animation.update(delta);
    // render model as usual etc.
}

Ofcourse this is just a quick example. The actual implementation will vary depending on the use case. For example you could also extend ModelInstance and keep track of the animation in there. Because it is very specific to the use-case, but very simple to implement, it is usually not worth using tools (like the Universal Tween Engine)

Here is another example I recently wrote for my latest tutorial, perhaps it helps as well. It rotates and moves the cards in this video.

Xoppa
  • 7,983
  • 1
  • 23
  • 34
  • I like this option. This weekend I'll try something similar to this. I'll let you know and mark this as the best answer in case it works. I'll keep you in the loop, thanks @Xoppa !! – Alex_ES Dec 31 '15 at 17:57
  • This is going to be the right choice. Now the question might be how to code in a clean and clear way :) Just something additional to this question: I have realized that rotating and translating was not the movement I wanted: I just needed to rotate but using one of the edges as axis when rotating (this way I'll set the left side as the new base), do you know how can I rotate the cube like that? it seems that rotation is always applied using the center of the cube as axis... maybe translate the cube, rotate and translate again to the original position (using Matrix3 objects with mul() )? Thx!! – Alex_ES Jan 04 '16 at 10:03
  • rotating around a specific point is the same as translating to that point, rotating and then translating back. `Vector3 t = new Vector3().set(point).sub(currentPos); transform.idt().translate(t).rotate(...).translate(t.scl(-1));` – Xoppa Jan 04 '16 at 10:14
  • That was my guess... last math lesson was a few years ago :) I'll let you know, thank you very much!! – Alex_ES Jan 04 '16 at 10:32
  • Ok, got it... almost!! Just a doubt about code you posted: `animation.toAngle = 90f`, that 90f value matches with 90 degrees (a right angle)? Cube got crazy when i set that value... As soon as I have it ready I'll post the correct solution :) – Alex_ES Jan 04 '16 at 15:17
  • Yes, it's degrees. It sounds like you forgot the `idt()` call (or `setToRotation` if you use that exact example, note the *To*). Otherwise the rotation will be accumulated (which is probably what you mean by crazy). – Xoppa Jan 04 '16 at 15:27
  • Ok, this was the solution! I have some other issues, but I'll create a new question and I'll add some code, as main point for this one is already solved and clarified (animation is done!). Thank you @Xoppa ! – Alex_ES Jan 04 '16 at 19:37