Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Libgdx ScrollPane adding space at the top

I'm creating a store for my game and I'm having issues with the libgdx ScrollPane. It seems to be moving the table within it down by 155px. The effect it's having is that the table appears roughly 155px down from the top, and the last button is off the screen no matter how far down I scroll.

Here is the window when the "Store" first appears.

Top of the scroll pane As you can see the top of the table is quite a bit below the top of the window. Code below, but the table only has 10px of padding.

Here is the window when I've scrolled down as far as I could go - sorry, the scroll pars disappeared before I could grab the screenshot.

Bottom of the scroll pane You can see that the "Main Menu" button is about half way off the screen.

Here is the code that lays out the "Store".

table = new Table();
table.setFillParent(true);
table.defaults().expandX().fill().space(5f);
table.pad(10f);

// characters
table.add(new Label("Characters: ", skin, "default")).left().colspan(2);
table.row();
ButtonGroup characterGroup = new ButtonGroup();
characterGroup.setMaxCheckCount(1);
Button boyButton = createImageTextButton("Plain Boy", boyTexture);
Button catButton = createImageTextButton("Cat Girl", catTexture);
Button hornButton = createImageTextButton("Horn Girl", hornTexture);
Button pinkButton = createImageTextButton("Pink Girl", pinkTexture);
Button queenButton = createImageTextButton("Queen", queenTexture);
float minHeight = 130f; // only used to force scrolling.
table.add(boyButton).minHeight(minHeight);
table.add(catButton).minHeight(minHeight).row();
table.add(hornButton).minHeight(minHeight);
table.add(pinkButton).minHeight(minHeight).row();
table.add(queenButton).minHeight(minHeight).colspan(2);
table.row();
characterGroup.add(boyButton, catButton, hornButton, pinkButton, queenButton);
characterGroup.setChecked("Plain Boy");

// drills
ButtonGroup drillGroup = new ButtonGroup();
Button flappyButton = createImageTextButton("Flappy", null);
Button tappyButton = createImageTextButton("Tappy", null);
Button tiltyButton = createImageTextButton("Tilty", null);
table.add(new Label("Drills:", skin, "default")).left().padTop(20).colspan(2);
table.row();
table.add(flappyButton).minHeight(minHeight);
table.add(tappyButton).minHeight(minHeight).row();
table.add(tiltyButton).minHeight(minHeight);
drillGroup.add(flappyButton, tappyButton, tiltyButton);
drillGroup.setChecked("Flappy");

// main menu button
table.row();
Button mainMenuButton = createImageTextButton("Main Menu", null);
table.add(mainMenuButton).minHeight(minHeight).padTop(40).padBottom(10f).colspan(2);

ScrollPane scrollPane = new ScrollPane(table, skin);
scrollPane.setBounds(0, 0, stage.getWidth(), stage.getHeight());
addActor(scrollPane);

I debugged the desktop version and saw that the table's y position was set to -155 before I scroll, and set to 0 after I scroll to the bottom. However, even when it's set to 0, the last button is always partly off the screen.

As requested here is the code where I create the viewport and camera:

package com.example;

import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.utils.viewport.ExtendViewport;
import com.badlogic.gdx.utils.viewport.Viewport;
import com.example.stages.GameStage;

public class MainGame extends ApplicationAdapter {

    public static final int MIN_WIDTH = 480;
    public static final int MIN_HEIGHT = 800;

    public static SpriteBatch batch;
    public static GameStage game;
    public static Skin skin;
    public static Viewport viewport;
    public static Stage stage;

    @Override
    public void create() {
        viewport = new ExtendViewport(MIN_WIDTH, MIN_HEIGHT);
        batch = new SpriteBatch();
        initSkin();
        game = new GameStage(viewport, batch, skin);
        setStage(game);
    }

    @Override
    public void dispose() {
        super.dispose();
        game.dispose();
        skin.dispose();
    }

    public void initSkin() {
        skin = new Skin(Gdx.files.internal("skins/uiskin.json"));
    }

    @Override
    public void render() {
        stage.act(Gdx.graphics.getDeltaTime());
        stage.draw();
    }

    @Override
    public void resize(int width, int height) {
        viewport.update(width, height, true);
    }

    public Skin getSkin() {
        return skin;
    }

    public static void setStage(Stage stage) {
        MainGame.stage = stage;
        Gdx.input.setInputProcessor(stage);
    }
}
like image 588
Townsfolk Avatar asked Dec 20 '22 08:12

Townsfolk


1 Answers

Ok, finally figured it out. Turns out the Table within the ScrollPane cannot be set to fill parent.

table.setFillParent(true);

Causes the issue. Not sure why it's doing that, but removing the setFillParent(true) fixes the issue.

like image 112
Townsfolk Avatar answered Feb 26 '23 17:02

Townsfolk