java - 表中的 LibGDX 按钮超出屏幕

Question

尝试在表行中放置两个按钮。 最右边的按钮稍微偏离屏幕。 使用 .add(btn).right() 添加到表中，但似乎没有任何效果。 文档提到了有关删除 Align.left 的内容，反之亦然，但我不确定他们在说什么。

通过移动设备工作。 拍了照片，上传到 ImageBucket，但看不到全部内容，所以又拍了两张(屏幕顶部 + 底部)以防万一。

屏幕顶部: https://i1161.photobucket.com/albums/q501/StudioGilliam/Screenshot_20190430-224041_TextBasedRPG.jpg 如您所见，标签显示良好。

屏幕底部: https://i1161.photobucket.com/albums/q501/StudioGilliam/Screenshot_20190430-224024_TextBasedRPG.jpg

有问题的代码:

public class TextBasedRPG implements ApplicationListener
{
   private Stage stage;
   private TextButton btnNext;
   private TextButton btnItems;
   private Label lblPlayer1;
   private Label lblEnemy1;
   private Label lblInfo;

   @Override
   public void create()
   {
      stage = new Stage(new ScreenViewport());
      Gdx.input.setInputProcessor(stage);

      // UI STUFF

      // Labels
      Label.LabelStyle styleL = new Label.LabelStyle(new BitmapFont(), Color.BLACK);
      lblPlayer1 = new Label("Player data", styleL);
      lblPlayer1.setFontScale(3.5f);

      lblEnemy1 = new Label("Enemy data", styleL);
      lblEnemy1.setFontScale(3.5f);
      lblEnemy1.setAlignment(Align.right);

      lblInfo = new Label("Information", styleL);
      lblInfo.setFontScale(4.0f);

    // Buttons
TextButton.TextButtonStyle styleTB = new TextButton.TextButtonStyle();
      styleTB.font = new BitmapFont();
      styleTB.up = new NinePatchDrawable(new NinePatch(new Texture(Gdx.files.internal("ButtonGreyUp.png")), 10, 10, 10, 10));
      styleTB.down = new NinePatchDrawable(new NinePatch(new Texture(Gdx.files.internal("ButtonGreyDown.png")), 10, 10, 10, 10));

      btnNext = new TextButton("Next Turn", styleTB);
      btnNext.setTransform(true);
      btnNext.setScale(6.0f);
      btnNext.setTouchable(Touchable.enabled);
      btnNext.align(Align.right);

      btnItems = new TextButton("Play", styleTB);
      btnItems.setTransform(true);
      btnItems.setScale(6.0f);
      btnItems.setTouchable(Touchable.enabled);

      // Table
      Table table = new Table();
      table.setBounds(0, 0, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
      table.setFillParent(true);

      table.pad(50);
      table.add(lblPlayer1).expandX().left();
      table.add(lblEnemy1).expandX().right();
      table.row();
      table.add(lblInfo).expandY().colspan(2);
      table.row();
      table.add(btnItems).expandX().left();
      table.add(btnNext).expandX().right();

      table.debugAll();

      stage.addActor(table);
   }

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

      stage.act();
      stage.draw();
   }

   @Override
   public void dispose(){stage.dispose();}

   @Override
   public void resize(int width, int height){}

   @Override
   public void pause(){}

   @Override
   public void resume(){}

Answer 1

我不建议使用setScale()，因为它只会影响 Actor 的表示并导致表格中的实际尺寸出现问题。

您应该为按钮使用合适的宽度和高度，并使用较大文本大小的字体。 您可以使用 GDX Freetype在启动时生成正确大小的字体。

以下是解决方案的示例方法:

我在这里对 UI 元素使用以下方法作为标签的示例:

这是在我的静态 UIHelper 类中:

public static Cell addToTable(Table table, Label label, float width) {
    Label.LabelStyle style = new Label.LabelStyle(skin.get("default", Label.LabelStyle.class));
    float aspectRatio = style.background.getMinWidth()/style.background.getMinHeight();
    float height = width / aspectRatio;
    style.font = Assets.font;
    style.fontColor = Assets.font.getColor();
    label.setStyle(style);

    label.setAlignment(Align.center);

    return table.add(label).width(width).height(height);
}

然后我可以调用:

float width = (float)Gdx.graphics.getWidth()*0.8f; // I want my label to be 80% of the screen width
UIHelper.addToTable(table, levelLabel, width).colspan(3).pad(20);

对于我的字体，我这样做:

private static BitmapFont generateFont(){
    FreeTypeFontGenerator generator = new FreeTypeFontGenerator(Gdx.files.internal("skins/beemelon/passion-one-regular.ttf"));
    FreeTypeFontGenerator.FreeTypeFontParameter parameter = new FreeTypeFontGenerator.FreeTypeFontParameter();
    parameter.size = (int) (38 * Gdx.graphics.getDensity()); // Change the 38 to a value fit for your game
    parameter.color = new Color(255f / 255f, 165f / 255f, 23f / 255f, 1f); // Divide by 255f to get a value between 0 and 1
    parameter.borderWidth = parameter.size / 10f;
    parameter.borderColor = Color.BLACK;
    BitmapFont bitmapFont = generator.generateFont(parameter);
    generator.dispose();
    return bitmapFont;
}

希望这可以帮助或插入您走向正确的方向。