加载九个补丁图像作为Libgdx Scene2d按钮背景看起来很糟糕 [英] Loading nine-patch image as a Libgdx Scene2d Button background looks awful

问题描述

我正在尝试使用通过（libgdx） NinePatch 像这样：

  this.dialogBu​​ttonUp = new NinePatchDrawable（
 new NinePatch（new Texture（Gdx） .files.internal（ 数据/按钮round.9.png））））; 
 this.dialogBu​​ttonDown = new NinePatchDrawable（
 new NinePatch（new Texture（Gdx.files.internal（data / button-round-down.9.png））））; 
  

然后我制作一个 TextButtonStyle 来描述按钮，并引用两个 NinePatch drawables：

  TextButton.TextButtonStyle buttonStyle = new TextButton.TextButtonStyle（）; 
 buttonStyle.font = aValidFontReally; 
 buttonStyle.fontColor = Color.BLACK; 
 buttonStyle.up = this.dialogBu​​ttonUp; 
 buttonStyle.down = this.dialogBu​​ttonDown; 
 buttonStyle.pressedOffsetX = -2; 
  

我正在通过对话 box：

  new Dialog（...）.button（Continue，null，buttonStyle）; 
  

我检查了 .9.png 文件以确保：

• 资产文件在Eclipse中刷新


• 表示元数据边框像素完全不可见或完全可见黑色


• Android draw9patch 工具可以加载图像和验证他们

关于检查或更改内容的任何其他建议？

解决方案

感谢@RodHyde的一些指示，看起来像libgdx NinePatch 类被设计为接受后处理的九个补丁纹理（即，使用单独的整数值描述如何将单个纹理切割成块）。这种处理通常是将.9.png文件打包到 TextureAtlas 中的副作用（参见 https://github.com/libgdx/libgdx/wiki/Texture-packer#ninePatches ）。纹理图集是一个非常好的主意（特别是当你的UI包含一堆不同的纹理元素时），所以这是有道理的，但在开发和尝试运行时有点令人惊讶。

要解决这个问题，我可以直接包含我写的.9.png文件：

  private static NinePatch processNinePatchFile（String fname）{
 final Texture t = new Texture（Gdx.files.internal（fname））; 
 final int width = t.getWidth（） -  2; 
 final int height = t.getHeight（） -  2; 
返回新的NinePatch（新的TextureRegion（t，1,1，宽度，高度），3,3,3,3）; 
} 
  

这会加载纹理，创建一个修剪掉1-的子区域像素元数据边框，然后猜测九个补丁边框元素是3像素宽/高。 （通过在纹理数据中进行正确计算似乎是可能的，但不值得付出努力 - 在这种情况下只需将纹理放在图册中。）

I'm trying to use a Nine Patch as a background for a Libgdx Scene2d UI button. It is loading, buts it is really ugly. I can see the "meta-data" pixels, and its being stretched as if it were just a regular image (the text on the button is "Continue"):

I'm loading the .9.png files directly into a (libgdx) NinePatchDrawable via a (libgdx) NinePatch like this:

this.dialogButtonUp = new NinePatchDrawable(
   new NinePatch(new Texture(Gdx.files.internal("data/button-round.9.png"))));
this.dialogButtonDown  = new NinePatchDrawable(
   new NinePatch(new Texture(Gdx.files.internal("data/button-round-down.9.png"))));

Then I make a TextButtonStyle that describes the button, and references the two NinePatch drawables:

TextButton.TextButtonStyle buttonStyle = new TextButton.TextButtonStyle();
buttonStyle.font =  aValidFontReally;
buttonStyle.fontColor = Color.BLACK;
buttonStyle.up = this.dialogButtonUp;
buttonStyle.down = this.dialogButtonDown;
buttonStyle.pressedOffsetX = -2;

I'm building the button indirectly, via a Dialog box:

new Dialog( ... ).button("Continue", null, buttonStyle);

I've checked the .9.png files to make sure that:

• that the asset files were refreshed in Eclipse
• that the meta-data border pixels are either fully-invisible or fully-visible-black
• that the Android draw9patch tool can load the images and verify them

Any other suggestions on what to check or change?

解决方案

Thanks to some pointers from @RodHyde, it looks like the libgdx NinePatch class is designed to accept a "post-processed" nine patch texture (i.e., with separate integer values that describe how to cut the single texture into patches). This "processing" usually happens as a side-effect of packing a ".9.png" file into a TextureAtlas (see https://github.com/libgdx/libgdx/wiki/Texture-packer#ninePatches). A texture atlas is a really good idea (especially when your UI includes a bunch of different texture elements), so this makes sense, but is a bit surprising when developing and trying to get something running.

To work-around this so I can directly include ".9.png" files I wrote this:

private static NinePatch processNinePatchFile(String fname) {
    final Texture t = new Texture(Gdx.files.internal(fname));
    final int width = t.getWidth() - 2;
    final int height = t.getHeight() - 2;
    return new NinePatch(new TextureRegion(t, 1, 1, width, height), 3, 3, 3, 3);
}

This loads the texture, creates a sub-region that trims off the 1-pixel meta-data border, and then just guesses that the nine-patch border elements are 3 pixels wide/tall. (Computing that correctly by mucking about in the texture data seems possible, but not worth the effort -- just put the texture in an atlas in that case.)

这篇关于加载九个补丁图像作为Libgdx Scene2d按钮背景看起来很糟糕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！