Libgdx,当 运行 在 android 时,舞台正在创建重复的小部件

Libgdx, stage is creating duplicate widgets when run on android

我正在尝试在屏幕上显示一个 TextField。当桌面版本为 运行 时,它可以完美运行,但是当我 运行 版本为 android 时,文本字段重复并且背景混乱。

screenshots

屏幕代码class:

public class SetupScreen implements Screen
{
    private Stage stage;
    private Table table;

    private TextField paymentField;

    @Override
    public void show()
    {
        stage = new Stage();
        Gdx.input.setInputProcessor(stage);
        table = new Table();
        table.setFillParent(true);
        stage.addActor(table);

        Pixmap bgPixmap = new Pixmap(1, 1, Format.RGBA8888);
        bgPixmap.setColor(Color.GRAY);
        bgPixmap.fill();
        Texture bgTexture = new Texture(bgPixmap);

        Pixmap cursorPixmap = new Pixmap(1, 1, Format.RGBA8888);
        cursorPixmap.setColor(Color.WHITE);
        cursorPixmap.fill();
        Texture cursorTexture = new Texture(cursorPixmap);

        Pixmap selPixmap = new Pixmap(1, 1, Format.RGBA8888);
        selPixmap.setColor(Color.BLUE);
        selPixmap.fill();
        Texture selTexture = new Texture(selPixmap);

        TextFieldStyle textFieldStyle = new TextFieldStyle();
        textFieldStyle.background = new SpriteDrawable(new Sprite(bgTexture));
        textFieldStyle.cursor = new SpriteDrawable(new Sprite(cursorTexture));
        textFieldStyle.selection = new SpriteDrawable(new Sprite(selTexture));
        textFieldStyle.font = new BitmapFont();
        textFieldStyle.fontColor = Color.WHITE;

        paymentField = new TextField("", textFieldStyle);
        paymentField.setMessageText("Pay Rate");

        table.add(paymentField);
    }

    @Override
    public void render(float delta)
    {
        stage.act(delta);
        stage.draw();
    }

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

    @Override
    public void pause()
    {
    }

    @Override
    public void resume()
    {
    }

    @Override
    public void hide()
    {
    }

    @Override
    public void dispose()
    {
        stage.dispose();
    }

}

你的屏幕完全乱了,因为你没有在每一帧的开头清除屏幕。

@Override
public void render(float delta) {
    Gdx.gl.glClearColor(0.0f, 0.0f, 0.0f, 0.0f);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT | GL20.GL_DEPTH_BUFFER_BIT);
    stage.act(delta);
    stage.draw();
}

UI 的另一件事是您应该 居中 您的相机。否则 UI 的左下角将位于屏幕中间。

您可以使用 Viewport.update() 方法的最后一个参数执行此操作。

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