I have a set of transparent PNGs all loaded (stacked) into a single PSD file. Each layer contains a different shape and each occupies a very specific location in a 256px square which has a transparent background.
I want to perform an operation that is very similar to what Layer > Distribute > Left Edges does. Except when I tell it to align the left edges, it doesn't use the left edge of the 256px square, it uses the leftmost pixel of each opaque shape within each layer. As a result, all the images get shifted from their specific location.
I need them to maintain their original positions so that when I load them as a sprite sheet into an HTML5 website and present them consecutively in the same spot, they don't appear to shift. Think of them as frames in an animation.
I have 60 such images in each of 8 separate stacks. Once I have them distributed horizontally, I want to take each of those and merge and distribute them vertically so that I have a complete sprite sheet with 8 rows and 60 columns of different images.
My problem is the distribution step. How can I get it to consider the transparent space in each image when calculating the spacing?
Said differently, I want to shift each layer so that:
- layer 1: 0 pixels to the right
- layer 2: 256 pixels to the right
- layer 3: 512 pixels to the right
- layer 4: 768 pixels to the right
- etc...
- layer 60: 15104 pixels to the right
I am using PS CS6.
Not all images are the same shape. Some might fill 200px horizontally, while another might fill only 50px, for example.