Extracting sprites from a larger PNG file

On the Pharo mailing list there was a discussion about extracting sprites from the larger PNG files. The LPC Character Generation website offers an example of such a larger set of sprites organized in one large PNG. I take this opportunity to describe how using the GTInspector makes us quickly find the solution to our problem through continuous visual feedback.

Let’s start. First, we download and inspect a sprites.png file.

Playground-sprites1.png

The preview tells us we have the correct file. Next, we load a form from the file.

self binaryReadStreamDo: [ :stream | PNGReadWriter formFromStream: stream ]

Playground-sprites2.png

Now that we got the form loaded in memory, we want to split this form in smaller forms associated to individual sprites. To this end, we first need to learn the size of each sprite. One way to do that would be to count the amount of rows and columns in the matrix, but that is too boring. Instead, we explore a bit. Likely, the sprite has a power of 2 dimension. We try with 32x32.

self copy: (0@0 corner: 32@32)

Playground-sprites22.png

Nah, that is not it. What about:

self copy: (0@0 corner: 64@64)

Playground-sprites23.png

This looks much better. We verify that the height and width are multiple of 64:

self width / 64   “==>13"
self height / 64  “==>21"

Great. Now we can proceed with splitting the form:

sprites := OrderedCollection new.
0 to: (self width - 64) by: 64 do: [ :x |
   0 to: (self height - 64) by: 64 do: [ :y |
      sprites add: (self copy: (x@y corner: (x+64)@(y+64)))]].
sprites

Playground-sprites3.png

And we are done. You can try this scenario with the latest Pharo.

Posted by Tudor Girba at 3 March 2016, 10:56 pm link
|