How to store/process metadata corresponding to a sprite

[lrdprdx]

Dear forum, I suppose this is some standard problem but I didn't find the solution on the Internet. There is a similar post here in the forum: https://www.love2d.org/forums/viewtopic.php?t=12314

which is not exactly the same but gave me an idea how to achieve what I want (more on that later). Nevertheless, I've chosen to add a new topic.

This is my intention. I have a sprite for HUD. Suppose the health bar. Along with the visual indication of the amount of health (by "filling" and "emptying" the bar) I want to have the textual one like 97/100 (see the screenshot).

All I need is the rectangular area inside the image/quad (I wrote a simple library to handle alignment and stuff) to place the text in. Now I do it manually (note that this is only first step in that direction): I draw my sprites in Aseprite, then I select the corresponding area and look at the values (x, y, w, h). I have several approaches to improve that:

1) Aseprite allows you to export a JSON file with user defined metadata along with the PNG. So you export your sprite and get two files: `icon.png` and `icon.json`. I don't really like this approach because it involves processing json and storing redundant data.

2) Aseprite allows you to write scripts in ... Lua (I am very exciting about this). So the idea is to write a script that

• Asks the user for a selection

• Asks the user for the name of the selected area

• Fills the predefined (or asks for) file for sprites and fills that with that data and saves the sprites

3) Put that data directly into PNG. I haven't investigated this deeply but seems that I can put user defined data into the image. Don't like this because it involves a separate tool (If I understand correctly Aseprite doesn't allow this). And moreover, it complicates the development.

So what is your suggestion here ?

Thank you in advance !

[Hugues Ross]

I don't think love provides the necessary methods to read image metadata, just the pixels.

Honestly, unless you have an enormous number of HUD sprites or you intend to change them many times I would just record the coordinates manually--the time you spend on any of the above solutions will likely cost more than just typing in the coordinates you need. A table for looking up sprite id => coords shouldn't be too hard to make.

The case of sprite sheets is a bit different since the number of frames and animations can be quite large, so I see more value in using tools to manage that...but UI elements with bars in them aren't usually that numerous. Hell, I'm making an RPG and I didn't even consider tooling for this bit because it's just not expensive to do.

[RNavega]

I'm for using the built-in JSON way, that is then post-processed by a simple Lua script that you'll write to consolidate that data into a Lua script with all your UI definitions.

So it becomes:

• Design the sprite

• Annotate the UI geometry in the metadata

• Export the sprite and JSON

• Run your Lua script to merge the data from the JSON into your UI definitions Lua script that will actually ship with your game

If you set up a batch file / shortcut, the post-process step is but a double click.

PS the only reason for doing this is of the interface for writing metadata in Asesprite is more convenient than using a text editor. If it's not, then you should do something else, like manually writing into the Lua UI definitions script as suggested by Hugues.

[dusoft]

3) Put that data directly into PNG. I haven't investigated this deeply but seems that I can put user defined data into the image. Don't like this because it involves a separate tool (If I understand correctly Aseprite doesn't allow this). And moreover, it complicates the development.

You are referring to EXIF data that can be encoded in JPG, PNG and others (this is how GPS data are encoded in your photos).

This library provided bindings to Libexif, which might be an overkill:
https://github.com/minoki/luaexif

Or you can try working with some pure Lua EXIF readers such as this and working with binary data directly:
https://gist.github.com/duckfly-tw/7c3c ... 3b12ba0711

But I would recommend going with something easier as JSON format as people have already mentioned.

[lrdprdx]

Thank you all for the replies ! I took some time and wrote a plugin (script) for Aseprite though merging in some sense several approaches. It is similar to the JSON approach but it saves the selection in the `.lua` file with the same name as your sprite:

This is the plugin (see attach). It is not fully polished though might be useful already and gives it a taste. We can go even further by extending that script with loading selections and displaying them.

[lrdprdx]

Extended with the ability to load selections:

[zorg]

3) Put that data directly into PNG. I haven't investigated this deeply but seems that I can put user defined data into the image. Don't like this because it involves a separate tool (If I understand correctly Aseprite doesn't allow this). And moreover, it complicates the development.

You are referring to EXIF data that can be encoded in JPG, PNG and others (this is how GPS data are encoded in your photos).

This library provided bindings to Libexif, which might be an overkill:
https://github.com/minoki/luaexif

Or you can try working with some pure Lua EXIF readers such as this and working with binary data directly:
https://gist.github.com/duckfly-tw/7c3c ... 3b12ba0711

But I would recommend going with something easier as JSON format as people have already mentioned.

For the record, png files specifically can handle more than just exif tags, since they can store custom chunks that decoders need to just ignore if they can't parse them (besides some mandatory ones, of course); e.g. the game Spore had unique chunks for storing species data inside png images as well.