Cocos2D-X free Sprite Sheet Packer, GIMP plugin

This is a small python plugin for GIMP to convert Layers into plist files. It is nice because you can use GIMP to edit sprites and then pack them with this simple Packer plugin. All you need to do is download and extract the files to your gimp plugins folder.
It uses a very simple algorithm to pack the sprites/layers but it is a free sprite sheet packer.

Requirements

Python 2.7+
gimpfu python library (usually installed with gimp but if any problem comes up check this first)

Installation

Tested with gimp 2.8 ubuntu and windows
To install the plugin put the python script(s) under your gimp plug-ins directory(probably is a hidden folder named .gimp-2.8 under your home/User folder) and start gimp
make sure the scripts are executable (linux only, chmod +x)

Usage

Simple Packing

Create a blank image in gimp
Drag your sprite images to gimp, all of them will be imported as layers
Go to Myscripts pack layers, then save the gimp file as xfc(Ctrl+S)
Then go to MyScripts and select plist

Animations plist

To export your layers as animations you have to follow a simple rule
Lets say I want to create a walking animation for a character and call it walk
Name your layers involved in walk animation as walk1, walk2, walk3…
Layer names shouldn’t contain ‘.’ character or any metachars
All steps from Packing apply here except instead selecting Plist select Plist animation


CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("walk.plist");

CCSprite *sprite = CCSprite::createWithSpriteFrameName("walk1");

CCAnimationCache *cache = CCAnimationCache::sharedAnimationCache(); 
cache->addAnimationsWithFile("walk-animations.plist"); 
CCAnimation *animation = cache->animationByName("walk"); 
CCAnimate *animate = CCAnimate::create(animation);


sprite->runAction(animate);

CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("walk.plist");

CCSprite *sprite = CCSprite::createWithSpriteFrameName("walk1");

CCAnimationCache *cache = CCAnimationCache::sharedAnimationCache();

cache->addAnimationsWithFile("walk-animations.plist");

CCAnimation *animation = cache->animationByName("walk");

CCAnimate *animate = CCAnimate::create(animation);

sprite->runAction(animate);

Download Link: plug-ins

Thats all, source code is below if interested. There is room for improvement feel free to extend it in anyway.

Source


#!/usr/bin/env python
from plistlib import *
from gimpfu import *
import os
import time

#plugin to export layers as plist

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

def cocos2dSpritesheet(img, drawable):

	gimp.context_push()

	plistFilename = os.path.splitext(img.filename)[0] + ".plist";
	print "You sent me this text: "+plistFilename

	plistFrames = dict()

	for layer in img.layers:
	#add frame

		frame = dict(
			x = layer.offsets[0],
			y = layer.offsets[1],
			width = layer.width,
			height = layer.height,
			offsetX = 0,
			offsetY = 0,
			originalWidth = layer.width,
			originalHeight = layer.height
		)

		plistFrames[layer.name] = frame

	result = dict(texture = dict(width = img.width, height = img.height), frames=plistFrames);
	writePlist(result, plistFilename)

	gimp.context_pop()

register(
	"my_second_script",    
    	"My Second Python-Fu",   
    	"Export as Plist",
    	"Ljapo Metin", 
    	"Mets-blog.com", 
    	"June 2013",
    	"<Image>/MyScripts/PList", 
    	"*", 
    	[],
    	[],
    	cocos2dSpritesheet,
    	)

main()

#!/usr/bin/env python

from plistlib import *

from gimpfu import *

import os

import time

#plugin to export layers as plist

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

def cocos2dSpritesheet(img, drawable):

gimp.context_push()

plistFilename = os.path.splitext(img.filename)[0] + ".plist";

print "You sent me this text: "+plistFilename

plistFrames = dict()

for layer in img.layers:

#add frame

frame = dict(

x = layer.offsets[0],

y = layer.offsets[1],

width = layer.width,

height = layer.height,

offsetX = 0,

offsetY = 0,

originalWidth = layer.width,

originalHeight = layer.height

)

plistFrames[layer.name] = frame

result = dict(texture = dict(width = img.width, height = img.height), frames=plistFrames);

writePlist(result, plistFilename)

gimp.context_pop()

"my_second_script",

"My Second Python-Fu",

"Export as Plist",

"Ljapo Metin",

"Mets-blog.com",

"June 2013",

"<Image>/MyScripts/PList",

"*",

[],

cocos2dSpritesheet,

)

main()


#!/usr/bin/env python
from plistlib import *
from gimpfu import *
from string import digits
import os
import time

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

#plugin to export layers as plist and animations plist

def contains_digits(s):
    for char in list(s):
        if char.isdigit():
            return True
            break
    return False

def frameDictionaryArray(frameNames):
	frameArray = []
	
	for name in reversed(frameNames):
		frameDict = dict(
				spriteframe = name,
				delayUnits = 1,
			    )
		frameArray.append(frameDict)

	frameArray[0] = dict(
				spriteframe = frameNames[-1],
				delayUnits = 1,
				notification = dict(firstframe = True)
			    )
	frameArray[-1] = dict(
				spriteframe = frameNames[0],
				delayUnits = 1,
				notification = dict(lastframe = True)
			    )

	return frameArray

def cocos2dSpritesheet(img, drawable):

	gimp.context_push()

	plistFilename = os.path.splitext(img.filename)[0] + ".plist";
	animationsFilename = os.path.splitext(img.filename)[0] + "-animations" + ".plist";

	plistFrames = dict()
	animationsList = dict()

	animationName = "bla"
	animationNames = []
	frameNames = []

	for layer in img.layers:
	#add frame

		frame = dict(
			x = layer.offsets[0],
			y = layer.offsets[1],
			width = layer.width,
			height = layer.height,
			offsetX = 0,
			offsetY = 0,
			originalWidth = layer.width,
			originalHeight = layer.height
		)

		plistFrames[layer.name] = frame
		frameNames.append(layer.name)

		if(contains_digits(layer.name)):
			animationName = ''.join([i for i in layer.name if not i.isdigit()])
			if(animationName not in animationNames):
				animationNames.append(animationName)

	result = dict(texture = dict(width = img.width, height = img.height), frames = plistFrames);
	writePlist(result, plistFilename)

	for animation in animationNames:

		
		animationDict = dict(
					delayPerUnit = 0.2,
					restoreOriginalFrame = True,
					loops = 1,
					frames = frameDictionaryArray([s for s in frameNames if animation in s])
				)

		animationsList[animation] = animationDict

	result = dict(animations = animationsList, properties = dict(spritesheets = [plistFilename.split('/')[-1]], format = 2));
	writePlist(result, animationsFilename)

	gimp.context_pop()

register(
	"my_third_script",    
    	"My third Python-Fu",   
    	"Export as Plist and Animations",
    	"Ljapo Metin", 
    	"Mets-blog.com", 
    	"June 2013",
    	"<Image>/MyScripts/PListAnimation", 
    	"*", 
    	[],
    	[],
    	cocos2dSpritesheet,
    	)

main()

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

#!/usr/bin/env python

from plistlib import *

from gimpfu import *

from string import digits

import os

import time

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

#plugin to export layers as plist and animations plist

def contains_digits(s):

for char in list(s):

if char.isdigit():

return True

break

return False

def frameDictionaryArray(frameNames):

frameArray = []

for name in reversed(frameNames):

frameDict = dict(

spriteframe = name,

delayUnits = 1,

)

frameArray.append(frameDict)

frameArray[0] = dict(

spriteframe = frameNames[-1],

delayUnits = 1,

notification = dict(firstframe = True)

)

frameArray[-1] = dict(

spriteframe = frameNames[0],

delayUnits = 1,

notification = dict(lastframe = True)

)

return frameArray

def cocos2dSpritesheet(img, drawable):

gimp.context_push()

plistFilename = os.path.splitext(img.filename)[0] + ".plist";

animationsFilename = os.path.splitext(img.filename)[0] + "-animations" + ".plist";

plistFrames = dict()

animationsList = dict()

animationName = "bla"

animationNames = []

frameNames = []

for layer in img.layers:

#add frame

frame = dict(

x = layer.offsets[0],

y = layer.offsets[1],

width = layer.width,

height = layer.height,

offsetX = 0,

offsetY = 0,

originalWidth = layer.width,

originalHeight = layer.height

)

plistFrames[layer.name] = frame

frameNames.append(layer.name)

if(contains_digits(layer.name)):

animationName = ''.join([i for i in layer.name if not i.isdigit()])

if(animationName not in animationNames):

animationNames.append(animationName)

result = dict(texture = dict(width = img.width, height = img.height), frames = plistFrames);

writePlist(result, plistFilename)

for animation in animationNames:

animationDict = dict(

delayPerUnit = 0.2,

restoreOriginalFrame = True,

loops = 1,

frames = frameDictionaryArray([s for s in frameNames if animation in s])

)

animationsList[animation] = animationDict

result = dict(animations = animationsList, properties = dict(spritesheets = [plistFilename.split('/')[-1]], format = 2));

writePlist(result, animationsFilename)

gimp.context_pop()

"my_third_script",

"My third Python-Fu",

"Export as Plist and Animations",

"Ljapo Metin",

"Mets-blog.com",

"June 2013",

"<Image>/MyScripts/PListAnimation",

"*",

[],

cocos2dSpritesheet,

)

main()

Pack Layers

I wrote also a small plugin to also pack your layers here you go


#!/usr/bin/env python

import os
import gimp
from gimpfu import *
import time

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

def spriteSheetPack(img, drawable, pad):

	gimp.context_push()
	
	x = 0;
	y = 0;

	for layer in img.layers:
		
		layer.set_offsets(x, y)
		
                x = x + layer.width + pad
		
		if x + layer.width > img.width:
			y = y + layer.height + pad
			x = 0

		
register(
	"my_fourth_script",    
    	"My fourth Python-Fu",   
    	"Pack layers",
    	"Ljapo Metin", 
    	"Mets-blog.com", 
    	"July 2013",
    	"<Image>/MyScripts/PackLayers", 
    	"*", 
    	[
		(PF_INT, "padding", "padding", 2),
    	], 
    	[],
    	spriteSheetPack,
    	)

main()

#!/usr/bin/env python

import os

import gimp

from gimpfu import *

import time

gettext.install("gimp20-python", gimp.locale_directory, unicode=True)

def spriteSheetPack(img, drawable, pad):

gimp.context_push()

x = 0;

y = 0;

for layer in img.layers:

layer.set_offsets(x, y)

x = x + layer.width + pad

if x + layer.width > img.width:

y = y + layer.height + pad

x = 0

"my_fourth_script",

"My fourth Python-Fu",

"Pack layers",

"Ljapo Metin",

"Mets-blog.com",

"July 2013",

"<Image>/MyScripts/PackLayers",

"*",

[

(PF_INT, "padding", "padding", 2),

[],

spriteSheetPack,

)

main()

This entry was posted in Cocos2D-X and tagged cocos2dx,gimp plugin,plist on June 6, 2013