Libgdx fills the screen with images
I’m new to Libgdx and had some issues filling the image to the entire screen. If I import a 1900×1200 image, it fills the screen, but if the image is 1024×512, the image does not stretch to the screen. Here is the code I used. I thought “background.setSize(stageWidth, stageHeight)” would scale the image to the screen, but that didn’t happen. Can you tell me what I’m doing wrong? I’ve tried toggling “setFillParent” (as described in another article) but it still doesn’t work. Also included here are screenshots currently displayed (on desktop implementations and Android): http://tinypic.com/r/b7j20z/8
Thanks for your help!
package com.mygdx.game;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.PerspectiveCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.scenes.scene2d.Actor;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.actions.Actions;
import com.badlogic.gdx.scenes.scene2d.actions.MoveToAction;
import com.badlogic.gdx.scenes.scene2d.ui.Image;
import com.badlogic.gdx.utils.viewport.FitViewport;
import com.badlogic.gdx.utils.viewport.StretchViewport;
import com.badlogic.gdx.utils.viewport.Viewport;
public class MyGdxGame implements ApplicationListener{
private Stage stage;
@Override
public void create() {
stage = new Stage();
float stageHeight = Gdx.graphics.getHeight();
float stageWidth = Gdx.graphics.getWidth();
Background
Texture board = new Texture(Gdx.files.internal("data/frame.png"));
Image background = new Image(board);
background.setOrigin(0, 0);
background.setSize(stageWidth, stageHeight);
background.rotateBy(0);
background.setPosition(0, 0);
stage.addActor(background);
}
@Override
public void dispose() {
stage.dispose();
}
@Override
public void render() {
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.act(Gdx.graphics.getDeltaTime());
stage.draw();
}
@Override
public void resize(int width, int height) {
}
@Override
public void pause() {
}
@Override
public void resume() {
}
}
Solution
After a little thought, the most likely cause of your problem is that you added the image directly to the root of the stage. The root of the stage is a group that does not handle any type of layout management, which can be the reason why your image is not sized correctly.
I recommend that you create a Table
instead, and then use setFillParent()
so that it takes up the entire screen. You can then simply use table.background(drawable)
to set the background using the table’s built-in function table.background. However, you must remember that Texture
does not count as a table drawable, so you must use the class TextureRegionDrawable
to get a valid drawable background. Here is an example:
table.background(new TextureRegionDrawable(new TextureRegion(board)));