Sprite Page Generator Script

Sat, 06/24/2017 - 19:19

Google Chrome 54 introduced the ability to take a full screenshot of a webpage in April 2017. This by itself is pretty cool. But, I happened to be working on some game code and wanted to build a simple sprite sheet. I found a program, but it appears that sprite sheets are normally built to fit the content on to the sheet as best as possible. That makes sense, but I wanted something where the location of the images was organized into columns. This way I could easily calculate the frames for animation. So I wrote my own little program to automate the process. The row and column structure are baked into the filename constrictions. 

The filename should be a number greater than 10000. This allows the row and column to converge. This allows a large number of frames to be placed into a matrix.




             * make sure that NOTHING has any padding or margin
             * */
            * {
                margin: 0;
                padding: 0;
                border-spacing: 0;
                 * Simple single image to spritesheet converter
                 * image filename format:
                 * [row]000[column].mime
                 * example(s):
                 * 100001.bmp
                 * 100002.bmp
                 * ...
                 * 200010.bmp
                 * 200011.bmp
                 * etc...
                 * */
                 // @param string virtual path to images
                 $path = '';
                 // @param integer row number
                 $rows = 8;
                 // @param integer column number
                 $columns = 46;
                 // @param string MIME type : [ *.jpg, *.png, *.bmp, *.gif ]
                 $mime = "bmp";
                 // loop through the rows
                for($y = 1; $y<=$rows;$y++) {
                    echo '<tr>';
                    // loop through the columns
                    for($x=0;$x<$columns;$x++) {
                        // build the file name for this frame
                        $img = $y * 10000 + $x.'.'.$mime;
                        // write an image tag 
                        echo '<td><img src="'.$img.'" /></td>';
                    echo '</tr>';