LIBGDX - 图像按钮 - 加入图像

Question

我正在尝试使用LIBGDX上的de Image Button创建一个基于两个图像的按钮。

使用添加到第二个图像，工作正常，但有一个问题。 图像大小不同。

注意：我正在测试相同的图片以查看结果

有没有办法纠正这个？对图像使用一些比例？

levelsTexture = new Texture(Gdx.files.internal("level1.png"));
levels = new TextureRegion(levelsTexture).split(TILE_WIDTH, TILE_HEIGHT);
ImageButton levels_image = new ImageButton(new TextureRegionDrawable(new              
TextureRegion(levels[0][0])));
levels_image.add(new Image (levels[0][0]));
stage.addActor(levels_image);
levels_image.setScale(2f);

问题：

Answer 1

ImageButton是Table类的扩展，通常将ImageButton图像设置为背景。像你所做的那样对第二个图像使用“添加”方法可能会有所作为，但它的行为与设置背景不同，如果你想要在单击按钮时也改变第二个图像，它也可能不是你想要的

将两个图像添加到单个ImageButton的最简单方法是简单地将两个图像组合在Photoshop（或等效的）中，并在ImageButton上使用该单个图像。

更高级（也更灵活）的方法是以编程方式组合这两个图像，并将其用作ImageButton的背景。这可以通过创建一个扩展BaseDrawable的自定义类来完成，并在构造函数中使用两个Images。如果您希望图像堆叠在一起，请将自定义可绘制类的minHeight设置为两个图像的组合高度。然后覆盖绘制方法并将两个图像绘制在彼此之上，如下所示：

@Override
public void draw(Batch batch, float x, float y, float width, float height){
    img1.getDrawable().draw(batch, x, y, img1.getWidth(), img1.getHeight());
    img2.getDrawable().draw(batch, x, y+img1.getHeight(), img2.getWidth(), img2.getHeight());
    }
}

ImageButton在其构造函数中使用了Drawable，因此您可以在创建它时将此对象直接传递到按钮中，并且两个图像都应显示在按钮中，并且它们将被视为一个。

我做过类似的事情，为使用多个图像的表格制作背景，这种方法效果很好。

Answer 2

我编写了自己的SpriteButton类，在其中我实现了这种方法来缩放纹理。

private Dimension getScaledDimension(Dimension imgSize, Dimension boundary) {

    int original_width = imgSize.width;
    int original_height = imgSize.height;
    int bound_width = boundary.width;
    int bound_height = boundary.height;
    int new_width = original_width;
    int new_height = original_height;

    // first check if we need to scale width
    if (original_width > bound_width) {
        //scale width to fit
        new_width = bound_width;
        //scale height to maintain aspect ratio
        new_height = (new_width * original_height) / original_width;
    }

    // then check if we need to scale even with the new height
    if (new_height > bound_height) {
        //scale height to fit instead
        new_height = bound_height;
        //scale width to maintain aspect ratio
        new_width = (new_height * original_width) / original_height;
    }

    return new Dimension(new_width, new_height);
}

然后最后绘制纹理，输出尺寸与要绘制的尺寸相同。

    sb.begin();
    sb.draw(this.texture2, this.x, this.y, dim_size_new.width, dim_size_new.height);
    sb.end();

因此，如果第一张图像尺寸正确，您可以在技术上将第二张图像绘制为第一张图像的大小。

您的实施方式与我的实施方式有所不同，但您应该可以在此处找出它。