2

As you can see in my code below, I create a camera using the width and height of the device target. Then I create stage with the size of the camera viewport and add a Window to it (everything works fine till here in any device).

However, when add a TextButton to the Windows is not re-sized accordingly to the Stage size.

So, how can I re-size a TextButton to looks good in any device?

    @Override
    public void create() {
        .
        .
        .
        // Define camera our view port in meters because of Box2D 
        camera = new OrthographicCamera(20,
                20 * (Gdx.graphics.getHeight() / (float) Gdx.graphics.getWidth()));

        // create stage with the size of the viewport
        stage = new Stage(new StretchViewport(camera.viewportWidth,camera.viewportHeight));


        // create restart button
        atlas = new TextureAtlas("data/ui/atlas.pack");
        skin = new Skin(Gdx.files.internal("data/ui/menu_skin.json"), atlas);
        TextButton restartButton = Util.createTextButton("Restart", skin, "red",
                new ClickListener() {
            @Override
            public void clicked(InputEvent event, float x, float y) {
                timer=timeMax;
            }
        });


        // create a window and add the restart to it
        skin.add("texture", new Texture("data/texture.png"));

        WindowStyle windowStyle = new WindowStyle(new BitmapFont(), Color.WHITE, skin.newDrawable("texture"));

        windowTryAgain = new Window("", windowStyle);
        windowTryAgain.setMovable(false);
        //windowTryAgain.padTop(20);

        //stage.addActor(window);
        windowTryAgain.setPosition(0, 0);
        windowTryAgain.setSize(2,2);

        windowTryAgain.row().fill().expandX();
        windowTryAgain.add(restartButton).fill(0f, 0f);
        windowTryAgain.center();
        windowTryAgain.setVisible(false);


        stage.addActor(windowTryAgain);
        .
        .
        .
}



public class Util {
    public static TextButton createTextButton(String text, Skin skin,
            String styleName, EventListener listener) {
        TextButton textButton = new TextButton(text, skin, styleName);
        textButton.pad(10);
        //Set height does not work in my case
        //textButton.setHeight(0.1f);
        textButton.addListener(listener);
        return textButton;
    }
}

1 Answer 1

0

You can make a secondary camera and attach it to your stage. To scale the table just scale the viewport size of the secondary camera

An example would be:

//Heres where you set the scale of your buttons and your table
Camera secondaryCamera = new Camera(Gdx.graphics.getWidth() * scale,
                                    Gdx.graphics.getHeight() * scale); 
Stage stage = new Stage();
Table table = new Table();
ImageButton button = new ImageButton(drawableUp, drawableDown, drawableChecked);
table.setFillParent(true);

stage.getViewport().setCamera(secondaryCamera);

table.add(ImageButton);
stage.addActor(table);

This works great when your using it for touch controls. You can use a table for the entire UI and scale it to your liking independent of your other game items;

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.