1

I've been following along with a LibGDX tutorial on Youtube and have come across an issue rendering a TiledMap to my screen. At the moment, I can render some labels/images using my HUD java class

public class HUD {
public Stage stage; //the background
private Viewport viewport; //so the HUD stays fixed and the world can move
private int score;
private int timer;
private int bactoCount;
private Texture foodTexture, antioBioBottle;

//these are widgets
Label antioBioTxt;
Image antiBioImg;
Label countDown;
Label countTxt;
Image foodImg;
Label foodTxt;
Label bactoCountLabel;
Label bactoTxt;
//these images need to be buttons...


public HUD (SpriteBatch sb) {
    foodTexture = new Texture("Bacto food.png");
    antioBioBottle = new Texture("Antibioticbottle.png");
    bactoCount = 0;
    timer = 0;
    viewport = new FitViewport(BactoBuds.V_WIDTH, BactoBuds.V_HEIGHT, new OrthographicCamera());

    stage = new Stage(viewport, sb);
    //stage = new Stage();
    //use a Table to organise widgets on the stage

    Table table = new Table();
    table.top();
    table.setFillParent(true); //the table is the size of our stage

    antioBioTxt = new Label("Antibiotic", new Label.LabelStyle(new BitmapFont(), Color.WHITE));
    antiBioImg = new Image(antioBioBottle);



    // %03d means its 3 digits long
    //bitmap font sets the font to bit style
    //string.format for changing from a string to a int

    countDown = new Label(String.format("%03d", timer), new Label.LabelStyle(new BitmapFont(), Color.WHITE));
    countTxt = new Label("Time to flood:", new Label.LabelStyle(new BitmapFont(), Color.WHITE));

    foodImg = new Image(foodTexture);
    foodTxt = new Label("Food", new Label.LabelStyle(new BitmapFont(), Color.WHITE));

    bactoCountLabel = new Label(String.format("%06d", bactoCount), new Label.LabelStyle(new BitmapFont(), Color.WHITE));
    bactoTxt = new Label("Bacteria:", new Label.LabelStyle(new BitmapFont(), Color.WHITE));

    //if multiple labels use expandX then they all share an equal portion of the screen

    table.add(antioBioTxt).expandX().padTop(10);
    table.add(foodTxt).expandX().padTop(10);
    table.add(bactoTxt).expandX().padTop(10);
    table.add(countTxt).expandX().padTop(10);
    table.row();
    table.add(antiBioImg).expandX();
    table.add(foodImg).expandX();
    table.add(bactoCountLabel).expandX().align(Align.center);
    table.add(countDown).expandX().align(Align.center);

    stage.addActor(table);


}

}

These render nicely on the screen. However, when I try to render up a background TMX map image, it renders in the wrong location. I've been messing with the code for a few days now, trying to change the position of the map position. At the first instance I was only able to see a tiny corner of the map and now I've gotten the whole thing to render, but it only takes up ~1/4 of the screen. Now I am at a loss as to how to proceed.

public class playScreen implements Screen{
private BactoBuds game;
private OrthographicCamera gamecamera;
private Viewport gameView;
private HUD HUD;
private TmxMapLoader mapLoader; //loads map to screen
private TiledMap map; //reference to map
private OrthogonalTiledMapRenderer renderer;




public playScreen (BactoBuds game) {
    this.game = game;



    gamecamera = new OrthographicCamera();
    gameView = new FitViewport(BactoBuds.V_WIDTH, BactoBuds.V_HEIGHT, gamecamera);

    HUD = new HUD(game.batch);

    mapLoader = new TmxMapLoader(); //make a new map loader, set map to maploader, then pass it to the renderer
    map = mapLoader.load("grassy.tmx");
    renderer = new OrthogonalTiledMapRenderer(map);


    gamecamera.setToOrtho(false);
    gamecamera.position.set(gameView.getWorldWidth() / 2, gameView.getWorldHeight() / 2, 0); //this changes map position
    renderer.setView(gamecamera);

}


@Override
public void show() {

}



@Override
public void render(float delta) {

    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

    renderer.render();
    game.batch.setProjectionMatrix(HUD.stage.getCamera().combined);

    HUD.stage.draw();


}

Please forgive the dodgy coding, I'm quite new and I'm still learning about good practices. I think it has something to do with the camera positioning, but swapping out the values doesn't appear to change anything.

public class BactoBuds extends Game {
public static final int V_WIDTH = 800;
public static final int V_HEIGHT = 480;
public static final String Title = "BactoBuds";
public SpriteBatch batch; //public to let other screens have access to images
private Texture img;
private Game game;
private Screen screen;
private OrthographicCamera camera;

public BactoBuds () {
    game = this;

}



@Override
public void create () {
    batch = new SpriteBatch();
    img = new Texture("badlogic.jpg");
    // change this to menuScreen later
    setScreen(new playScreen(this));


}

public void dispose () {
    batch.dispose();
    img.dispose();
}

@Override
public void render () {

    super.render();
}

public void resume (){

}

public void pause () {

}

}

Thanks for the help!

2
  • How large is your TiledMap? If you need to scale. You can set a scale in the OrthogonalTiledMapRenderer constructor
    – Eric
    May 31, 2016 at 13:09
  • Thanks for replying. I ended up changing the background image to a texture, but if I change the code back, I'll be sure to give the scaling ago. I remember attempting to use a scaledViewPort or some such to no avail. When setting the "float unitScale" is that typically written as something like 2 or 2f? or do I need to declare it before I use it? (Sorry, for the noob question)
    – Jediworm
    Jun 2, 2016 at 8:47

2 Answers 2

0

You need to call camera.update() within render method.

1
  • Thanks for replying! I tried adding gamecamera.update() to the render method and then to the playscreen method in the playscreen java class. However this did not change the position of the background map. I then added camera.update() to the render method in my main BactoBuds java class, but it just crashes the app with a "java.lang.NullPointerException"
    – Jediworm
    May 28, 2016 at 12:57
0

Have you tried moving your camera? If only 1/4 of the map is visible your camera might be centered at 0,0 while your map uses that as the bottom left origin of the texture.

Try camera.position.set(BactoBuds.V_WIDTH / 2, BactoBuds.V_HEIGHT / 2, 0);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.