LibGdx - Transition between Screens

Question

I\'m trying to change the animation between Libgdx Screens. I want to write my custom animation (fade in, fade out, etc). Can someone give me a clue? I can\'t seem to find the i

Answer 1

Here is what i do:

FadeIn is pretty simple, just add this to your fadein Screens show():

stage.getRoot().getColor().a = 0;
stage.getRoot().addAction(fadeIn(0.5f));

FadeOut is a little trickier. You dont want to switch screens immediately, so instead of calling game.setScreen(newScreen) create a method in your fadeout Screen like this:

public void switchScreen(final Game game, final Screen newScreen){
    stage.getRoot().getColor().a = 1;
    SequenceAction sequenceAction = new SequenceAction();
    sequenceAction.addAction(fadeOut(0.5f));
    sequenceAction.addAction(run(new Runnable() {
        @Override
        public void run() {
            game.setScreen(newScreen);
        }
    }));
    stage.getRoot().addAction(sequenceAction);
}

Like this, you delay the screen switching for the duration of the fade out.

Answer 2

This is a sample code of my game in transitions animation between screens: in MainGame class:

@Override public void setScreen(final Screen screen) {
        if (getScreen() == null)
        {
            createScreenInAction(screen);
            return;
        }
        createScreenOutAction(getScreen(), new Runnable() {
            @Override public void run() {
                createScreenInAction(screen);
            }
        });

    }
    private void createScreenOutAction(final Screen screen , Runnable runnable) {
        Actor actor = ((BaseScreenAdapter) screen).getStage().getRoot();
        actor.setOrigin(WIDTH_HALF,HEIGHT_HALF);
        actor.getColor().a = 1;
        SequenceAction sequenceAction = new SequenceAction();
        sequenceAction.addAction(Actions.parallel(Actions.alpha(0,SCREEN_SWITCH_DURATION) , Actions.scaleTo(1.5f,1.5f , SCREEN_SWITCH_DURATION, Interpolation.exp5)));
        sequenceAction.addAction(Actions.run(runnable));
        actor.addAction(sequenceAction);
    }
    private void createScreenInAction(final Screen screen) {
        StarsGame.super.setScreen(screen);
        Actor actor = ((BaseScreenAdapter) screen).getStage().getRoot();
        actor.setOrigin(WIDTH_HALF,HEIGHT_HALF);
        actor.getColor().a = 0;
        SequenceAction sequenceAction = new SequenceAction();
        sequenceAction.addAction(Actions.scaleTo(1.5f,1.5f , 0));
        sequenceAction.addAction(Actions.parallel(Actions.alpha(1,SCREEN_SWITCH_DURATION) , Actions.scaleTo(1.0f,1.0f , SCREEN_SWITCH_DURATION , Interpolation.exp5)));
        actor.addAction(sequenceAction);

    }

and all my screens extends as BaseScreenAdapter:

public abstract class BaseScreenAdapter extends ScreenAdapter implements BaseRequest.BaseResponseError{
    protected final AssetsController mAssets;
    protected final MySettings mSettings;
    protected StarsGame mGame;
    protected Stage mStage;
    protected Viewport mViewport;
    protected OrthographicCamera mCamera;
    protected InputMultiplexer multiplexer;
    protected LoadingActor mLoadingActor;
    //==============================================================
    // METHODS
    //==============================================================
    public BaseScreenAdapter(StarsGame game) {
        this.mGame = game;
        mCamera = new OrthographicCamera(/*StarsGame.WIDTH, StarsGame.HEIGHT*/);
        mCamera.position.set(StarsGame.WIDTH_HALF, StarsGame.HEIGHT, 0);
        mViewport = new FitViewport(StarsGame.WIDTH, StarsGame.HEIGHT, mCamera);
        mCamera.position.set(mCamera.viewportWidth / 2f, mCamera.viewportHeight / 2 , 0);

        initStage();
        initInputMultiplexer();
    }

    public Stage getStage() {
        return mStage;
    }
    private void initStage() {
        mStage = new Stage(mViewport);
        mStage.addListener(new InputListener() {
            @Override public boolean keyUp(InputEvent event, int keycode) {
                if (keycode == Input.Keys.BACK)
                {
                    onBackPressed();
                }
                return super.keyUp(event, keycode);
            }
        });
    }
}

Answer 3

I've implemented some sliding transitions using Scene2D and the universal tween engine. You can find example code here.

http://www.netthreads.co.uk/2012/02/09/libgdx-scene2d-demo-with-scene-transitions/

Update: This article illustrates the approach I took to implement sliding transitions. There is a link at the bottom which takes you to a set of demos here https://github.com/alistairrutherford/libgdx-demos

There are clear instructions on how to build the demos but you will need to have at least a basic grasp of maven and how to set it up.

Answer 4

I've implemented similar methods. Thanks to Gustavo Steigert, I learned a lot from his blog here's where you could find his example with the sequence of fadeIn and fadeOut.

http://steigert.blogspot.in/2012/02/3-libgdx-tutorial-scene2d.html

You can follow through his blog completely to have a better idea of the flow of things and find the tags for the post's source code in the end of each if his posts.