Flash when changing the screen with fading out effect

Question

I am trying to achieve a simple fadeIn and fadeOut effect when transitioning between screens. I have set a stage but when designing my app I did not use any actors. Therefore, I have put it a black screen as an actor and then I set the alpha to 0 on show(). When fading out what I do is I fade in the black image using

stage.addAction(Actions.sequence(Actions.fadeIn(1), Actions.run(new Runnable() {
            @Override
            public void run() {
                game.setScreen(new gameScreen(game));

This works, however there is a small problem, right at the end of the fade there is a small flash for a millisecond which shows the previous screen before it switches so the transition is not smooth, the black image is removed before switching screens. How can I fix this?

Answer 1

your problem is that stage.clear() and stage.dispose() is being called before rest of your app is being rendered last time.

The solution is to override dispose() Screen method and manually set some flag shouldBeRendered to false and then dispose your stage.

    boolean shouldBeRendered = true;

    ...

    public void render(float delta)
    {
        Gdx.gl.glClearColor(0, 0, 0, 1);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

        if(shouldBeRendered)
        {
            //here you render all
        }

        ...
    }

    ...

    @Override
    public void dispose()
    {
        shouldBeRendered = false;

        stage.clear();
        stage.dispose();
    }

You can add some System.out.println() to both render and dispose methods to see the flow of Screen circle of life