在 Libgdx 中渲染图像

Question

最近我开始使用 Libgdx 进行开发，遇到了一个似乎可以解决的问题。我想将 Scene2d 中的 Image 对象渲染到屏幕上，但它不渲染任何东西。它只是显示一个空白屏幕。

这是我的 skin.json 文件：

 {

com.badlogic.gdx.scenes.scene2d.ui.Image: {
    logo: { drawable: logo }
    exit: { drawable: exit }
},
com.badlogic.gdx.graphics.Color: {
    green: { a: 1, b: 0, g: 1, r: 0 },
    white: { a: 1, b: 1, g: 1, r: 1 },
    red: { a: 1, b: 0, g: 0, r: 1 },
    black: { a: 1, b: 0, g: 0, r: 0 },
},

}

这是我的 skin.atlas 文件：

skin.png
format: RGBA8888
filter: Nearest,Nearest
repeat: none
logo
  rotate: false
  xy: 1, 1
  size: 384, 93
  orig: 384, 93
  offset: 0, 0
  index: -1
help
  rotate: false
  xy: 387, 30
  size: 65, 64
  orig: 65, 64
  offset: 0, 0
  index: -1
musicoff
  rotate: false
  xy: 454, 30
  size: 65, 64
  orig: 65, 64
  offset: 0, 0
  index: -1
musicon
  rotate: false
  xy: 521, 30
  size: 65, 64
  orig: 65, 64
  offset: 0, 0
  index: -1
exit
  rotate: false
  xy: 588, 30
  size: 64, 64
  orig: 64, 64
  offset: 0, 0
  index: -1
settings
  rotate: false
  xy: 654, 30
  size: 64, 64
  orig: 64, 64
  offset: 0, 0
  index: -1

ScreenWrapper 类：

package screens;

import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.utils.viewport.StretchViewport;

import engine.Values;

import com.badlogic.gdx.scenes.scene2d.Stage;

public abstract class ScreenWrapper extends Stage implements Screen{

    protected ScreenManager manager;
    public ScreenWrapper(ScreenManager manager) {
        super( new StretchViewport(Values.WIDTH, Values.HEIGHT, new OrthographicCamera()));
        this.manager = manager;
    }

    // All the actors will be added here
    public abstract void initiate();
    public abstract void buildStage();
    @Override
    public void show() {

    }
    @Override
    public void render(float delta) {
        act();
        draw();
    }
    @Override
    public void resize(int width, int height) {
        setViewport(new StretchViewport(Values.WIDTH, Values.HEIGHT));
    }
    @Override
    public void pause() {

    }
    @Override
    public void resume() {

    }
    @Override
    public void hide() {

    }
}

这是我的主文件：

package screens;

import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.scenes.scene2d.ui.Image;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;

import engine.Values;

public class MenuScreen extends ScreenWrapper{

    private ScreenRenderer renderer;
    public MenuScreen(ScreenManager manager) {
        super(manager);
        renderer = new ScreenRenderer();
    }

    @Override
    public void initiate() {
        manager.getLoader().load("skin.json", Skin.class);
    }
    @Override
    public void buildStage() {
        Skin skin = manager.getLoader().getAsset("skin.json", Skin.class);
        Image logo = new Image(skin.getDrawable("logo"));
        logo.setSize(Values.LOGO_WIDTH, Values.LOGO_HEIGHT);
        logo.setOrigin(logo.getX() + Values.LOGO_WIDTH / 2, logo.getY()
                + Values.LOGO_HEIGHT / 2);
        logo.setPosition(Values.WIDTH / 2 - Values.LOGO_WIDTH / 2,
                Values.HEIGHT);
        addActor(logo);
        Gdx.app.log("X and Y", "X : " + logo.getX() + ", Y : "+logo.getY());
        Gdx.app.log("Width and Height", "Width : " + logo.getWidth() + ", Height : " + Values.HEIGHT);
    }

    @Override
    public void render(float delta) {
        super.render(delta);
        Gdx.gl.glClearColor(242/255f, 242/255f, 242/255f, 0);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
    }

}

我做错了什么？

编辑：好的，我将问题缩小到我的 JSON 文件。看起来我没有正确声明 logo 元素。如何在 JSON 中声明 Image 元素？

编辑 2：我尝试将 JSON 文件更改为：

{

com.badlogic.gdx.scenes.scene2d.ui.ImageButton$ImageButtonStyle: {
    logo: { imageUp: logo, imageDown: logo }
},
com.badlogic.gdx.graphics.Color: {
    green: { a: 1, b: 0, g: 1, r: 0 },
    white: { a: 1, b: 1, g: 1, r: 1 },
    red: { a: 1, b: 0, g: 0, r: 1 },
    black: { a: 1, b: 0, g: 0, r: 0 },
},

}

但是还是不行……

编辑 3：我尝试将徽标的 .png 文件作为纹理对象加载到徽标 actor 中，但它仍然没有绘制任何内容。我是这样做的：pastebin.com/n6iB2ymD

解决方案：好的，我终于想通了。原来 Values.Logo_Width 和 Values.Logo_Height 都是 0，所以 Image 的大小设置为 0...

Answer 1

MenuScreen 是 Stage 吗？从代码中看不太清楚。如果是，则需要在render方法中添加对act和draw方法的调用：

@Override
public void render(float delta) {
    super.render(delta);
    Gdx.gl.glClearColor(242/255f, 242/255f, 242/255f, 0);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
    act();
    draw();
}

这些方法绘制添加到舞台的Actors。

Answer 2

您需要确保在绘制之前而不是之后清除屏幕。

@Override
public void render(float delta) {
    Gdx.gl.glClearColor(242/255f, 242/255f, 242/255f, 0);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
    super.render(delta);
}

此外，您在舞台上设置了一个新视口，而从未更新它，因此视口不知道屏幕的大小。在 ScreenWrapper 中更改您的 resize 方法，如下所示：

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