简体   繁体   中英

LibGDX: Parallax effect with tiled maps

Need to make parallax effect in the game with LibGDX and tiled map. Background should move with different speed then foreground. In the docs https://github.com/libgdx/libgdx/wiki/Tile-maps said:

By rendering each layer separately and modifying the view for every layer, you can also achieve a parallax effect.

Current implementation : with PlayScreenVariantOne all works but background moving with same speed like foreground

public class PlayScreenVariantOne implements Screen {

    private TextureAtlas atlas;
    private OrthographicCamera gameCam;
    private Viewport viewport;
    private TmxMapLoader mapLoader;
    private TiledMap map;
    private OrthogonalTiledMapRenderer renderer;
    ...

    // ...
    // ... bla-bla-bla...
    // ...
    @Override
    public void render(float delta) {
        update(delta);
        Gdx.gl.glClearColor(0, 0, 0, 1);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

        renderer.setView(gameCam);
        renderer.render();

        game.batch.setProjectionMatrix(gameCam.combined);
        game.batch.begin();

        player.draw(game.batch);
        game.batch.end();
        hud.stage.draw();

    }
 }

Parallax implementation : with PlayScreenVariantTwo foreground and background rendered with same speed. Parallax effect does not work! :*(

public class PlayScreenVariantTwo implements Screen {

    private TextureAtlas atlas;
    private OrthographicCamera gameCam;
    private Viewport viewport;
    private TmxMapLoader mapLoader;
    private TiledMap map;
    private OrthogonalTiledMapRenderer renderer;
    ...

    // ...
    // ... bla-bla-bla...
    // ...
    @Override
    public void render(float delta) {
        update(delta);
        Gdx.gl.glClearColor(0, 0, 0, 1);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

        int[] backgroundLayers = { 7 };
        int[] ground = { 9 };

        renderer.setView(gameCam.combined, (gameCam.position.x - gameCam.viewportWidth / 2 - 2), gameCam.position.y - gameCam.viewportHeight / 2, gameCam.viewportWidth, gameCam.viewportHeight);
        renderer.render(backgroundLayers);

        renderer.setView(gameCam.combined, (gameCam.position.x - gameCam.viewportWidth / 2) / 10, gameCam.position.y - gameCam.viewportHeight / 2, gameCam.viewportWidth  * 10, gameCam.viewportHeight);
        renderer.render(ground);

        game.batch.setProjectionMatrix(gameCam.combined);
        game.batch.begin();

        player.draw(game.batch);
        game.batch.end();

        hud.stage.draw();

    }
 }

Did you try to simply multiply X (or Y, what ever you need) coordinate for background with factor:

  renderer.setView(gameCam.combined, (gameCam.position.x*0.5 - gameCam.viewportWidth / 2 - 2), gameCam.position.y - gameCam.viewportHeight / 2, gameCam.viewportWidth, gameCam.viewportHeight);

or

  renderer.setView(gameCam.combined, (gameCam.position.x - gameCam.viewportWidth / 2 - 2)*0.5, gameCam.position.y - gameCam.viewportHeight / 2, gameCam.viewportWidth, gameCam.viewportHeight);

I added that "*0.5", so background would move twice slower. Not sure which one of those 2 rows will give you better results - you have to try for your self, but that's the ide - multiply background coordinates, X or Y, which one you need to set different speed.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM