【问题标题】:Loading nine-patch image as a Libgdx Scene2d Button background looks awful将九个补丁图像加载为 Libgdx Scene2d 按钮背景看起来很糟糕
【发布时间】:2013-03-12 07:40:33
【问题描述】:

我正在尝试使用 Nine Patch 作为 Libgdx Scene2d UI 按钮的背景。它正在加载,但它真的很难看。我可以看到“元数据”像素,它像普通图像一样被拉伸(按钮上的文本是“继续”):

我正在通过 (libgdx) NinePatch.9.png 文件直接加载到 (libgdx) NinePatchDrawable 中,如下所示:

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"))));

然后我创建一个描述按钮的TextButtonStyle,并引用两个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;

我正在通过Dialog 框间接构建按钮:

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

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

  • 资产文件已在 Eclipse 中刷新
  • 元数据边框像素是完全不可见或完全可见的黑色
  • Android draw9patch 工具可以加载图像并验证它们

关于检查或更改什么的任何其他建议?

【问题讨论】:

  • 尝试使用 NinePatch.draw() 使用 SpriteBatch 绘制每个 NinePatch,因为这至少可以隔离问题所在,即,如果它有效,那么问题不是 NinePatch。
  • 好点!我刚试了一下,直接NinePatch.draw(...) 也看到了同样的丑陋。所以DialogButton 并没有搞砸。
  • 查看 NinePatch 源代码 (github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/…) 如果您使用带有单个 Texture 参数的构造函数,我认为它的作用不大。试试这个构造函数: public NinePatch (Texture texture, int left, int right, int top, int bottom)
  • 是的,看起来有“预处理”(即“.9.png”)和“后处理”九个贴图,NinePatch 是用于后处理的.创建一个TextureAtlas 看起来会进行处理。我没有看到对“.9.png”的任何运行时支持,但也许我还没有找到正确的地方......

标签: java libgdx nine-patch


【解决方案1】:

感谢@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;
    return new NinePatch(new TextureRegion(t, 1, 1, width, height), 3, 3, 3, 3);
}

这会加载纹理,创建一个修剪掉 1 像素元数据边框的子区域,然后猜测九个补丁边框元素是 3 像素宽/高。 (通过在纹理数据中乱搞来正确计算似乎是可能的,但不值得付出努力——在这种情况下,只需将纹理放入图集中即可。)

【讨论】:

猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-02-08
  • 2012-05-10
相关资源
最近更新 更多