简体   繁体   English

libGDX动画纹理区域

[英]libGDX Animating Texture Regions

I have a sprite image texture that looks like this: 我有一个精灵图像纹理,看起来像这样: 柯比·朗(Kirby Run)

And I'm trying to animate it. 我正在尝试制作动画。 I have this code set up to store each frame into a TextureRegion variable then store all the frames into an Animation TextureRegion array 我将这段代码设置为将每个帧存储到TextureRegion变量中,然后将所有帧存储到Animation TextureRegion数组中

//AssetLoader class
runTexture = new Texture("kirbyrun.png");
runTexture.setFilter(TextureFilter.Nearest,TextureFilter.Nearest);

//Run Hiro
hiro1 = new TextureRegion(runTexture,0,55,37,55);
hiro1.flip(false,true);
hiro2 = new TextureRegion(runTexture,37,55,44,55);
hiro2.flip(false,true);
hiro3 = new TextureRegion(runTexture,81,55,44,55);
hiro3.flip(false,true);
hiro4 = new TextureRegion(runTexture,129,55,46,55);
hiro4.flip(false,true);
hiro5 = new TextureRegion(runTexture,176,55,41,55);
hiro5.flip(false,true);
hiro6 = new TextureRegion(runTexture,216,55,41,55);
hiro6.flip(false,true);
hiro7 = new TextureRegion(runTexture,257,55,41,55);
hiro7.flip(false,true);
hiro8 = new TextureRegion(runTexture,301,55,42,55);
hiro8.flip(false,true);

TextureRegion[] run = {hiro1,hiro2,hiro3,hiro4,hiro5,hiro6,hiro7,hiro8};
hiroRunAnimation = new Animation<TextureRegion>(0.5f,run);
hiroRunAnimation.setPlayMode(Animation.PlayMode.LOOP);

I'm current using a yDown coordinate system which is why I flip the image. 我当前使用的是yDown坐标系,这就是我翻转图像的原因。

After trying to render this out using this code: 在尝试使用以下代码将其呈现出来之后:

TextureRegion currentFrame = AssetLoader.hiroRunAnimation.getKeyFrame(runTime);

sb.begin();

sb.draw(currentFrame,player.getX(),player.getY(),player.getWidth(),player.getHeight());
sb.end();

It just opens with a picture of blocks instead of Kirby: 它只是以块的图片而不是Kirby开头: 在此处输入图片说明

It's obvious I'm doing something wrong, I'm guessing its with my TextureRegion section, maybe my X, Y coordinates or wrong but I'm not sure how to fix this because I used spritecow.com to obtain these coordinates. 显然我在做错事,我在TextureRegion部分猜测了它的错位,也许是我的X,Y坐标错误,但是我不确定如何解决此问题,因为我使用了spritecow.com来获取这些坐标。 I'm assuming the top left corner is (0,0) and positive Y means moving down the image. 我假设左上角为(0,0),正Y表示向下移动图像。 How can I make Kirby actually appear instead of these boxes? 如何使Kirby实际代替这些框出现? Or would it just be easier to separate each frame image into a separate .png file and just use Texture instead of TextureRegion so I don't need to specify a definitive area. 还是将每个帧图像分离成一个单独的.png文件并仅使用Texture而不是TextureRegion会更容易,所以我不需要指定确定的区域。 Then I could use Animation or would that not work as well? 然后我可以使用“动画”还是不能正常工作?

Am I see it right, that you "hard coded" the coordinated for the sprites? 我看对了吗,您对这些图片进行了“硬编码”? That is not a very good idea, libGDX has a more comfortable way to solve this: Texture Packer . 这不是一个好主意,libGDX有一个更舒适的解决方案: Texture Packer

Basically, what you do is to put the single sprites into one folder an run the texture packer script to merge them all. 基本上,您要做的是将单个精灵放置在一个文件夹中,然后运行纹理打包程序脚本将它们全部合并。 You will also get a json file with the sprite coordinates. 您还将获得带有精灵坐标的json文件。 You can easily load them with a asset manager. 您可以使用资产管理器轻松加载它们。 I created an example for that here: https://gist.github.com/reime005/87e1ed30548be31a632292a604f397ef 我在这里为此创建了一个示例: https : //gist.github.com/reime005/87e1ed30548be31a632292a604f397ef

The black boxes are because you're incorrectly defining the region positions. 黑框是因为您错误地定义了区域位置。 You're starting all regions at y = 55 which is incorrect since the texture starts at y = 0 . 您从y = 55开始所有区域,这是不正确的,因为纹理从y = 0开始。 You're also flipping the textures, which are making them display upside-down, so remove the flipping as well. 您还正在翻转纹理,这使它们上下颠倒显示,因此也请删除该翻转。 It also seems that you're incorrectly determining the region sizes for some of the regions, so you should probably double-check them. 似乎您在错误地确定某些区域的区域大小,因此您可能应该仔细检查它们。

Your code should look like this: 您的代码应如下所示:

// Note the third value have changed to zeroes and the flipping has been removed.
hiro1 = new TextureRegion(runTexture,0,0,37,55);
hiro2 = new TextureRegion(runTexture,37,0,44,55);
hiro3 = new TextureRegion(runTexture,81,0,44,55);
hiro4 = new TextureRegion(runTexture,129,0,46,55);
hiro5 = new TextureRegion(runTexture,176,0,41,55);
hiro6 = new TextureRegion(runTexture,216,0,41,55);
hiro7 = new TextureRegion(runTexture,257,0,41,55);
hiro8 = new TextureRegion(runTexture,301,0,42,55);

After doing this the result is this: 完成此操作后的结果是:

在此处输入图片说明

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM