Additive tweens with Universal Tween Engine in libgdx?

Question

I have a sprite looping a tween, like an idle animation. I want to add another tween to it, so they both play at the same time. (For example, if my first tween moves it up, and my second tween moves it right, I want it to move up and right.)

But whenever I play my second tween, it seems to override the first one completely. What am I doing wrong?

Here's my code:

Tween.to(sprTurtle, SpriteAccessor.POS_XY, 0.4f)
    .waypoint(posTurtle[0] + (20 * density), posTurtle[1] + (20 * density))
    .target(posTurtle[0] + (30 * density), posTurtle[1])
    .ease(Quad.INOUT)
    .path(TweenPaths.catmullRom)
    .repeatYoyo(Tween.INFINITY, 0)
    .delay(0.1f)
    .start(tweenManager);
Tween.to(sprTurtle, SpriteAccessor.POS_XY, 1f)
    .target(50, 50)
    .repeat(Tween.INFINITY, 0)
    .start(tweenManager);  

Answer 1

This code would make image in cont2 which is a ViewContainer to move first from (0,100) then to (100, 100) in sequence.

        Timeline.createSequence()
        .push(Tween.set(cont2, ViewContainerAccessor.POSITION_XY))
        .push(Tween.to(cont2, ViewContainerAccessor.POSITION_XY, 0.5f).target(0,100))
        .push(Tween.to(cont2, ViewContainerAccessor.POSITION_XY, 0.5f).target(100,100))
        .start(tweenManager);

In my code, the image first goes down, then goes right.

Perhaps it should be like this in your code

    Timeline.createSequence()
    .push(Tween.to(sprTurtle, SpriteAccessor.POS_XY, 0.4f)
        .waypoint(posTurtle[0] + (20 * density), posTurtle[1] + (20 * density))
        .target(posTurtle[0] + (30 * density), posTurtle[1])
        .ease(Quad.INOUT)
        .path(TweenPaths.catmullRom)
        .repeatYoyo(Tween.INFINITY, 0)
        .delay(0.1f))
    .push(Tween.to(sprTurtle, SpriteAccessor.POS_XY, 1f)
        .target(50, 50)
        .repeat(Tween.INFINITY, 0))
    .start(tweenManager);

If you actually want two images to move at the same time, you will have to make two ViewContainers so they could move at the same time.

In the MainActivity.java of the official demo apk , you could see the following code. I add the LinearLayout genueHamster2 and VieewContainer cont2 to move two images at the same time.

  private LinearLayout genueHamster;
  private LinearLayout genueHamster2; // I add another LinearLayout so we could have
                                      // two images at the same time.

  @Override public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    //Setup it
    // a linearlayout in activity_main.xml
    genueHamster = (LinearLayout) findViewById(R.id.main_cont);
    // add for second image        
    genueHamster2 = (LinearLayout) findViewById(R.id.main_cont_2);
    setTweenEngine();
  }

  public void startAnimation(View v) {

    // Create object which we will animate
    ViewContainer cont = new ViewContainer();
    // Add a new container for the second image.
    ViewContainer cont2 = new ViewContainer();
    // pass our real container
    cont.view = genueHamster;
    // put it into the second container
    cont2.view = genueHamster2;

    // /start animations

    // Now you can have two images moving at the same time.
    Tween.to(cont, ViewContainerAccessor.POSITION_XY, 0.5f)
            .target(500, 0).ease(Bounce.OUT).delay(1.0f)
            .start(tweenManager);               

    Tween.to(cont2, ViewContainerAccessor.POSITION_XY, 0.5f)
            .target(0, 500)
            .ease(Bounce.OUT)
            .delay(1.0f)
            .repeatYoyo(2, 0.5f)
            .start(tweenManager);

  }