将 plus/minus 个按钮添加到 table 个单元格 LibGDX

Question

我正在寻找一种方法来向 LibGDX 中的 table 个单元格添加加号和减号按钮。我正在尝试做类似这张图片的事情：

我注意到我正在使用的 uiskin 文件包含加号和减号按钮（就在复选框旁边），它们可以正常工作 (uiskin.png)。

关于如何将这些添加到我的 table 并使其成为 table 单元格中的整数值的任何提示？

我添加了一个基本的示例代码，其中指明了我想要做什么：

@Override
public void create() {
    Stage stage = new Stage();
    Skin skin = new Skin(Gdx.files.internal("skins/uiskin.json"));

    Table table = new Table(skin);
    table.setPosition(Gdx.graphics.getWidth() / 2, Gdx.graphics.getHeight() / 2);
    for(int i = 0; i < 10; i++){
        table.add(Integer.toString(i)); //Somehow add plus/minus buttons left 
                                        //and right that increase/decrease the integer value
        table.row();
    }

    stage.addActor(table);

    Gdx.input.setInputProcessor(stage);
}


@Override
public void render() {
    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);

    stage.act(Gdx.graphics.getDeltaTime());
    stage.draw();
}

这只是一些示例代码，但如果它能在这里运行，我一定能够弄明白。

谢谢

Answer 1

首先，您需要一个数组来存储您的数字值。使用视图（table 单元格）来存储模型（数字值）不是一个好习惯，此外，标签单元格存储的是字符串，而不是整数，因此会很不方便。

private int[] tableData = new int[10];

现在您需要一个可以与数据中的行相关联的按钮。这是创建 ImageButton 子类的一种方法，它可以采用行号和模式（减或加）。

public class IncrementButton extends ImageButton {

    public final int rowNumber;
    public final boolean decrement;

    public IncrementButton (Skin skin, String styleName, int rowNumber, boolean decrement){
        super(skin, styleName);
        this.rowNumber = rowNumber;
        this.decrement = decrement;
    }
}

您正在使用的 uiskin 图集中的正负图像称为 "tree-minus" 和 "tree-plus"。您需要为每个使用其中一个作为 imageUp 属性的 ImageButton 样式。（如果您没有为其他状态定义图像，例如 imageDown，imageUp 将用作默认值。）您可以将这些添加到 uiskin.json:

com.badlogic.gdx.scenes.scene2d.ui.ImageButton$ImageButtonStyle: {
    plus: { down: default-round-down, up: default-round, imageUp: tree-plus },
    minus: { down: default-round-down, up: default-round, imageUp: tree-minus }
},

现在您可以为这些按钮创建一个 ChangeListener，它将修改数据中的数字并相应地更新 table。然后全部设置好：

Stage stage = new Stage();
Skin skin = new Skin(Gdx.files.internal("skins/uiskin.json"));

final Table table = new Table(skin);
final Label[] labels = new Label[tableData.length]; //keep references to the labels for updating them.

final ChangeListener incrementListner = new ChangeListener() {
    @Override
    public void changed(ChangeEvent event, Actor actor) {
        IncrementButton incrementButton = (IncrementButton)actor;
        int row = incrementButton.rowNumber;
        tableData[row] += incrementButton.decrement ? -1 : 1;
        labels[row].setText(Integer.toString(tableData[row]));
    }
};

table.setPosition(Gdx.graphics.getWidth() / 2, Gdx.graphics.getHeight() / 2);
for(int i = 0; i < tableData.length; i++){
    IncrementButton decrementButton = new IncrementButton(skin, "minus", i, true);
    decrementButton.addListener(incrementListner);
    IncrementButton incrementButton = new IncrementButton(skin, "plus", i, false);
    incrementButton.addListener(incrementListner);

    table.add(decrementButton);
    labels[i] = table.add(Integer.toString(i)).getActor();//Add number label and keep reference to it in labels array for the change listener to look up
    table.add(incrementButton);
    table.row();
}

stage.addActor(table);

Gdx.input.setInputProcessor(stage);

如果你想为数据设置最小值和最大值，那么你需要一些用于加号按钮和减号按钮的数组（类似于 labels 数组），以便更改侦听器可以查找和 disable/enable 达到限制时相应的按钮。

将 plus/minus 个按钮添加到 table 个单元格 LibGDX

Add plus/minus buttons to table cell LibGDX

java

layout

libgdx

scene2d