Non square Spritesheets S4P

Given a sprite-sheet which doesn’t have sprites placed out in a square form, what precaution could one take to load it in properly. As I am finding an issue that the sprite-sheet isn’t being ‘cut-up’ properly and the sprites are not displayed effectively.

1 Like

I have a txt with the position of eachSprite but I do not see anyway to be able to load this up into S4P does it feature this functionality ?

S4P assumes sprite sheets have sprites all the same size and tiled without any gaps.

I would be prepared to add a new S4P feature that would accept an ASCII file containing the sprites position and size. The problem is the format of the sprite position/ size metadata, I would think either XML or JSON what do others think.

2 Likes

I would love that ! Many SpriteSheets online assume you have some kind of loader for position of each one or a parser like I’m unity. Like for example on OpemGameArt so many are irregular spritesheets and it just a pain. I really don’t want to be loading every single individual frame that just a pain ! Maybe I should switch this project into unity ? But so started it off in Processing as I wanted to prove / build my own little game engine. To be featured with Processing. Going have to see then I guess. Thank you @quark either way !

I just did a google on unity sprite metadata and I suspect it uses its own unity-specific format for storing this data and probably has its own utility function to allow users to create this data.

The first step is to define the file format and the metadata used to describe a sprite. As I said I would use XML or JSON which is likely to be best?

Personally I would probably go for JSON but that might not be the best option.

So if you or anyone else has any ideas on how this feature would be implemented please chip in. :smiley:

1 Like

Perhaps you should pick an already existing format used by other spritesheet libraries.

2 Likes

Good point - that was why I looked at Unity because the OP mentioned it.

I didn’t make it clear but I was looking to see if anyone was aware of any standard format for this type of data.

To take GoToLoop’s suggestion further is anyone familiar with any sprite library that uses text files to define sprite sheet metadata.

2 Likes

+10 for offering to add useful features to a library.

Possibly of interest:

Atlas files and json:

https://phasereditor2d.com/docs/texture-packer.html

Looks like until recently a no-dominant standard problem.

3 Likes

For this feature to be useful we need a tool to generate the metadata files because creating them by hand would be ****. The atlas files seem promising I will have to investigate further.

In the past I have used GIMP to copy and paste from a spritesheet into a new graphics.

1 Like

I think (?) that the TexturePacker software is one popular way of managing this kind of metadata without hand-typing json values.

There is a great simple online tool for doing the basics of packaging irregular sprites with metadata – it is drag and drop, and uses a space packing algorithm. You drag files (of any irregular dimensions) into the window, and it does rectangle packing to try to create a compact, vertical, or horizontal sheet. You can also tweak the coordinates of individual files. Here it is:

I believe it is hosted by the TexturePacker creators.

Then you select the data format setting (e.g. json) and click the button to download a metadata file (“json”) alongside the resulting spritesheet image (“png”).

Here is the json that it generates:

{
	"frames": {
		"RunRight01.png": {
			"frame": {
				"x": 1,
				"y": 1,
				"w": 128,
				"h": 128
			},
			"rotated": false,
			"trimmed": false,
			"spriteSourceSize": {
				"x": 0,
				"y": 0,
				"w": 128,
				"h": 128
			},
			"sourceSize": {
				"w": 128,
				"h": 128
			}
		},
		"RunRight02.png": {
			"frame": {
				"x": 131,
				"y": 1,
				"w": 128,
				"h": 128
			},
			"rotated": false,
			"trimmed": false,
			"spriteSourceSize": {
				"x": 0,
				"y": 0,
				"w": 128,
				"h": 128
			},
			"sourceSize": {
				"w": 128,
				"h": 128
			}
		}
	},
	"meta": {
		"app": "http://www.codeandweb.com/texturepacker",
		"version": "1.0",
		"image": "spritesheet.png",
		"format": "RGBA8888",
		"size": {
			"w": 260,
			"h": 130
		},
		"scale": "1"
	}
}

I’m not sure that I understand rotated, trimmed, or scale – which are included but I don’t think can be set using the web interface – but most of it is pretty self-explanatory, and I believe the point is that it is a set of basic metadata features that are TexturePacker compatible. Global sheet metadata is in “meta” at the end. Documentation for the full software (not the quick web tool) is here:

2 Likes

@jeremydouglass that looks great and as you say I would need to investigate the various TexturePacker metadata tags.

@InferNova please try out th “Free Sprite Sheet Packer” and / or Texture Packer and see what you think as a tool to create the text file. If it is OK then using the TexturePacker format is the way to go.

2 Likes

I have used this to generate the text file. The issue for me was how do I translate it with S4P it be nice to build that you load in the txt and S4P will keep track of the co-ords of each box.

And as for what data type I would propose CSV. Each frame just stored with their X and Y and height and width.

I am gonna see if I can cook up something maybe that could be added to S4P ? Is there a github that I could post a request on with my code for S4P ?