Page 1 of 1

Adding Transparency around Sprites in a Sprite Sheet

Posted: 2013-12-26T12:37:30-07:00
by Abraa
I am working on a project which contains lots of large sprite sheets. I know the size of these sprite sheets and the size of each individual image in the sprite sheet. I need to go through these sprite sheets and add some transparency borders around each individual image within the sprite sheet. The amount of transparency that I need to add will be defined by myself and may vary depending on which side of the image I am targeting.

To make this more clear here is an example:

I have a sprite sheet which is 1504 x 560 which contains 16 sprite images each being 188 x 280. The sprite sheet has two rows of 8 images.

For this sprite sheet I need to add 20 pixels of transparency to the left side of each sprite, 16 pixels of transparency to the top side of each sprite and 10 pixels of transparency to the right side of each sprite.

The new resulting sprite sheet would have 16 sprite images each being 218 x 296 ( 188 + 20 + 10 x 280 + 16 ). The size of the sprite sheet would be 1744 x 592.

Summary:
I need a command to isolate a small section of a larger image and add different amounts of transparency to the four sides of the isolated section.
I plan to use this command in combination with a batch script to alter each image within a sprite sheet.

Thanks

Re: Adding Transparency around Sprites in a Sprite Sheet

Posted: 2013-12-26T13:25:14-07:00
by fmw42
Please post a link to an example spritesheet. You can upload to any free service such as dropbox. Then put a link here to your dropbox image.

Also identify your version of IM and platform.

Also please clarify. In on statement you want to add borders to the whole sheet and in another statement you seem to want to add borders to each or selected sprites. So I am confused what you want to do.

Edit:

Adding borders to separate sides of the whole sheet is easy. See -splice at http://www.imagemagick.org/Usage/crop/#splice

Doing so for individual sprites, means that you have to crop out each sprite, add borders, then montage them together again. See -crop at http://www.imagemagick.org/Usage/crop/#crop_tile and montage at http://www.imagemagick.org/Usage/montage/

Re: Adding Transparency around Sprites in a Sprite Sheet

Posted: 2013-12-27T12:58:53-07:00
by Abraa
I edited my original post slightly to be more clear. I need to add borders to each individual image within the sprite sheet. Crop -> Add Border -> Montage seems to be what I need. I will give it a try later.

Thanks

Re: Adding Transparency around Sprites in a Sprite Sheet

Posted: 2013-12-27T20:13:16-07:00
by snibgo
Here's a simple way. We chop into rows, splice the top transparency to each row, and append them back together. Likewise for the columns but we need two splices. Windows script:

Code: Select all

convert -size 1504x560 gradient: s.png

convert ^
  s.png ^
  -background none ^
  -crop 0x280 -splice 0x16 -append ^
  -crop 188x0 -splice 10x0+188+0 -splice 20x0 +append ^
  +repage ^
  s1.png

identify s1.png