在 Slick2D 中使用具有不同大小精灵的精灵表

发布于 2025-01-08 09:39:05 字数 338 浏览 0 评论 0原文

我在 API 中搜索了 SpriteSheet,但找不到查找有关如何制作具有不同大小的精灵的精灵表的任何内容。

我使用的精灵表有一行 16x16px 的图块,下面有一行 24x24px 的图块,下面有一行 8x8px 的图块,依此类推。

最初,我没有使用 Slick2D,而是使用 BufferedImage.getSubimage() 从精灵表的临时 BufferedImage 中获取每个精灵。这里有类似的方法可供我使用吗?

I searched through the API for SpriteSheet, but I couldn't find anything on how to make a sprite sheet with different sized sprites.

The sprite sheet that I'm using has a row of 16x16px tiles, a row of 24x24px tiles under it, a row of 8x8px under that, and so on.

Originally, not using Slick2D, I used BufferedImage.getSubimage() to obtain each sprite from a temporary BufferedImage of the sprite sheet. Is there a similar method here that I can use?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

半衬遮猫 2025-01-15 09:39:05

我认为在当前版本的 API 中没有办法直接生成子图像,至少在撰写本文时是这样。

但是,我可以想到三种可能的选项(除了自己添加所述方法调用的选项之外 - 它是 开源 毕竟):

  1. 您可以从同一源 Image 实例化多个 SpriteSheet 对象,每个 Sprite 大小一个,如果您真的很想把它们留在相同的源文件。
  2. 您可以获取 Image 实例,并在其上调用 getSubImageImage 拆分为三张图像,每种尺寸各一张(24x24、16x16、等等)。然后,从这些子图像中实例化 SpriteSheets
  3. 您可以根据大小将源文件拆分为单独的文件。也就是说,将 24x24 精灵单元放在一个文件中,将 16x16 精灵单元放在另一个文件中,依此类推。

I don't believe there is a way to do a direct sub-image in the current version of the API, at least at the time of this writing.

However, there are three possible options that I can think of (in addition to the option of just adding said method calls yourself - it's open source after all):

  1. You could instantiate several SpriteSheet objects from the same source Image, one for each Sprite size, if you really want to keep them in the same source file.
  2. You could take the Image instance, and call getSubImage on it to split the Image into three images, one for each size (24x24, 16x16, and so on). Then, from those sub-images, instantiate SpriteSheets.
  3. You could split the source file into separate files based on the size. That is, have your 24x24 sprite cells in one file, your 16x16 in another file, and so on.
月下伊人醉 2025-01-15 09:39:05

您可以只保留一个 Image 并使用 Graphics 对象的 drawImage 方法的重载来指定在哪里绘制图像的哪一部分:

g.drawImage(image, x1, y1, x2, y2, srcX1, srcY1, srcX2, srcY2);

请参阅 [javadoc](http://slick.cokeandcode.com/javadoc/org/newdawn/slick/ Graphics.html#drawImage(org.newdawn.slick.Image, float, float, float, float, float, float, float, float))

第一个参数是图像的实例。接下来的两个参数定义屏幕上渲染开始的点。 X2 和 y2 定义渲染的终点。通常,x2 为 x1 + spriteWidth,y2 为 y1 + spriteHeight,但您可以更改这些值以绘制不同尺寸的精灵。
最后四个参数的工作方式相同,但它们定义了将在屏幕上绘制的精灵表的区域。

如果我们以您的示例为例,我们想要从第三行绘制第二个图块,则调用将如下所示:

int tileWidth = 8;
int tileHeight = 8;
int sourceX = 40;
int sourceY = 8; //as its the sec
int drawX = 34;
int drawY = 65;
g.drawImage(image, drawX, drawY, drawX + tileWidth, drawY + tileHeight
    , sourceX, sourceY, sourceX + tileWidth, sourceY + tileHeight);

当我使用 spritesheet 时,我在某些情况下有硬编码值(非常罕见的情况,主要是测试)和 sprite 类,存储了源 x1、x2、y1 和 y2 值。我可以将它们打包在一个列表或地图中,就像我有一个精灵索引一样。通常我会以某种方式生成定义,然后序列化列表,因此如果需要,我可以简单地重新加载该列表。

这是我的 XML 定义的一个简短示例(我在 xml 中存储宽度和高度,而不是 x2 和 y2 值,因为我发现它更容易阅读并且更方便手动编辑。反序列化后,我计算 x2 和 y1 值):

<spriteSheet imageName="buildings" name="buildings">
  <sprite name="1x2 industry 01" spriteX="0" spriteY="0" width="50" height="112"/>
  <sprite name="1x2 quarters 01" spriteX="50" spriteY="0" width="50" height="112"/>
  <sprite name="1x1 spaceport 01" spriteX="243" spriteY="112" width="51" height="56"/>
      ...
</spriteSheet>

You can just keep an Image and use an overload of the Graphics object's drawImage method to specify where to draw which part of the image:

g.drawImage(image, x1, y1, x2, y2, srcX1, srcY1, srcX2, srcY2);

See [javadoc](http://slick.cokeandcode.com/javadoc/org/newdawn/slick/Graphics.html#drawImage(org.newdawn.slick.Image, float, float, float, float, float, float, float, float))

The first parameter is the instance of the image. The next two parameter define the point on screen, where the rendering begins. X2 and y2 define the end point of the rendering. Usually x2 is x1 + spriteWidth and y2 is y1 + spriteHeight, but you can change those values to draw the sprite in different sizes.
The last four parameters work the same, but they define the area of the sprite sheet, that will be drawn on screen.

If we take your example and we want to draw the second tile from the third row the call would look like this:

int tileWidth = 8;
int tileHeight = 8;
int sourceX = 40;
int sourceY = 8; //as its the sec
int drawX = 34;
int drawY = 65;
g.drawImage(image, drawX, drawY, drawX + tileWidth, drawY + tileHeight
    , sourceX, sourceY, sourceX + tileWidth, sourceY + tileHeight);

When I work with spritesheet, I have hardcoded values in some (very rare cases, mostly tests) and a sprite class, that has the source x1, x2, y1 and y2 values stored. I can pack a bunch of them in a list or a map and like that I have a sprite index. Usually I generate the definitions somehow and then serialize the list, so I can simply reload that list, if I need it.

Here is a short example of my XML definition (I store the width and height rather then the x2 and y2 values in the xml, as I find it more human readable and more convenient for manual editing. After deserialization I calculate the x2 and y1 values):

<spriteSheet imageName="buildings" name="buildings">
  <sprite name="1x2 industry 01" spriteX="0" spriteY="0" width="50" height="112"/>
  <sprite name="1x2 quarters 01" spriteX="50" spriteY="0" width="50" height="112"/>
  <sprite name="1x1 spaceport 01" spriteX="243" spriteY="112" width="51" height="56"/>
      ...
</spriteSheet>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文