将加号/减号按钮添加到表格单元格 LibGDX

Question

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

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

关于如何将它们添加到我的表格并使其增加/减少该表格单元格中的整数值的任何提示？

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

@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

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

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”。您需要一个 ImageButton 样式来使用其中一个作为 imageUp 属性。 （imageUp 用作默认值，如果您没有为其他状态定义图像，例如 imageDown。）您可以将这些添加到 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 来修改数据中的数字并相应地更新表格。然后全部设置：

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 数组），以便更改侦听器可以查找并禁用/启用按钮相应地，当达到限制时。