将 scene2d.ui 与 libgdx 一起使用：皮肤从何而来？

Posted 2023-02-25

【中文标题】将 scene2d.ui 与 libgdx 一起使用：皮肤从何而来？

【英文标题】：Using scene2d.ui with libgdx: where does the skin come from?

【发布时间】：2013-09-02 18:46:39

【问题描述】：

我已阅读有关 libgdx 的 scene2d features 的信息，包括 UI 元素，但我无法让它们工作。他们似乎都使用了一个皮肤对象，我该如何创建一个？

我已经通过 nice tutorial 创建了一个简单的 libgdx 游戏来捕捉桶中的雨滴，我还通过使用 texture atlas 加载图像创建了一个简单的棋盘游戏应用程序。然而，scene2d 听起来是一种更好的方式来控制棋盘游戏应用程序中的移动棋子以及任何按钮和菜单。

【参考方案1】：

要加载皮肤，您可以从 libgdx 测试项目中使用的示例皮肤文件开始。

Atlaspack File Json File Atlaspack Image Font File

this question 中有更多细节，我发现我必须将文件移动到资产的子目录中以避免 html 版本中的错误。 （如果我将文件留在 assets 文件夹中，我会看到一条错误消息，例如“GwtApplication: exception: Error reading file data/uiskin.json.”）

我发布了一个显示单个按钮的complete example，有趣的代码都在game class 中。该示例非常简单，您只需要两个成员变量来保存场景和按钮。

private Stage stage;
private TextButton button;

要创建皮肤，您只需加载数据文件。

Skin skin = new Skin(Gdx.files.internal("data/uiskin.json"));

将按钮连接到舞台。

stage = new Stage();
button = new TextButton("Click Me!", skin);
stage.addActor(button);

将监听器连接到按钮，并注册舞台以接收事件。

button.addListener(new ClickListener() 
    @Override
    public void clicked(InputEvent event, float x, float y) 
        button.setText("Clicked!");
    
);
Gdx.input.setInputProcessor(stage);

render() 方法基本上是对stage.draw() 的调用。

Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);

stage.act(Math.min(Gdx.graphics.getDeltaTime(), 1 / 30f));
stage.draw();

那么你只需要在调整屏幕大小时对屏幕进行布局。

button.setPosition(
        (width-button.getWidth())/2, 
        (height-button.getHeight())/2);

如果您的屏幕更复杂，请考虑使用Table。

如果您想使用不同的字体，您可以使用Hiero 生成字体文件和图像文件。完成此操作后，您必须获取新字体图像并使用 TexturePacker 将其与另一个 skin assets 重新打包。

【参考方案2】：

现在 Libgdx 提供 Git 仓库来获取皮肤，你可以从：https://github.com/libgdx/libgdx-skins 下载它，将 assets:https://github.com/libgdx/libgdx-skins/tree/master/skins/visui/assets 复制到你的项目中