Sprite Sheet Animation for Cocos2d-x v3

cocos2d-x C++
#1

Hi all,
I have looked for the cocos2d-x v3 tutorial from internet for a week, but will cant find a good tutorial that can teach me how to do the animation by using sprite sheet. >_<

I have done the plist and png by using texturePacker (please find the attached files), anyone can teach me to play the simple animation from the test.png ( the png included 11 images).


test-hd.plist.zip (0.7 KB)


test-hd.png (60.1 KB)


test.plist.zip (0.7 KB)


test.png (24.8 KB)

#2 
SpriteFrameCache::getInstance()->addSpriteFramesWithFile("test.plist");
auto testBatchNode=SpriteBatchNode::create("test.png");
this->addChild(testBatchNode);
auto testSprite=Sprite::createWithSpriteFrameName("test1.png");
auto animation=Animation::create();
for(int i=1;i<=11;i++)
{
	char szName[100]={0};
	sprintf(szName,"test%d.png",i);
	animation->addSpriteFrame(SpriteFrameCache::getInstance()->spriteFrameByName(szName));
}
animation->setDelayPerUnit(0.1f); 
testSprite->runAction( CCRepeatForever::create( CCAnimate::create(animation))); 
testBatchNode->addChild(testSprite);
#3

Hi libragagu,

It’s great! thanks a lot! thanks for your help!:slight_smile:

If you don’t mind, could you add my Skype:niccolohui?

thanks!

Niccolo

#4

Actually in the era of data oriented design composing frames into animation sequence directly in the code looks like a stone age.
There is the AnimationCache class which can load animations from the xml/plist-file. But I wonder which editor/tool can be used to create those files (googling did not help).

#5

@niccolo You’re welcome,I’ve already sent a request to you.
I’m a beginner too,I hope we can learn from each other.:slight_smile:

#6

@dotsquid Thank you, now I know another way to create animations.

AnimationCache *animationCache =AnimationCache::getInstance();
animationCache->addAnimationsWithFile("Animation.plist");
Animation* animation = animationCache->animationByName("Animation");

I wonder what does that plist file look like,and if it needs other data source files,I wonder what types are they(like png)?

1 Like
#7

ActionsTest.cpp and SpriteTest.cpp have examples of using AnimationCache. The plists used for the tests can be found here:

/tests/cpp-tests/Resources/animations/animations.plist
/tests/cpp-tests/Resources/animations/animations-2.plist

Hope that helps

#8

@toojuice
Thank you!I’ve learnt many things today.
I still have two questions:
1.In the animations.plist file there are only sprite frame names

<key>dance_2</key>
	<dict>
		<key>delay</key>
		<real>0.2</real>
		<key>frames</key>
		<array>
			<string>grossini_dance_gray_01.png</string>
			<string>grossini_dance_gray_02.png</string>
			<string>grossini_dance_gray_03.png</string>
			<string>grossini_dance_gray_04.png</string>
			<string>grossini_dance_gray_05.png</string>
			<string>grossini_dance_gray_06.png</string>
			<string>grossini_dance_gray_07.png</string>
			<string>grossini_dance_gray_08.png</string>
			<string>grossini_dance_gray_09.png</string>
			<string>grossini_dance_gray_10.png</string>
			<string>grossini_dance_gray_11.png</string>
			<string>grossini_dance_gray_12.png</string>
			<string>grossini_dance_gray_13.png</string>
			<string>grossini_dance_gray_14.png</string>
		</array>
	</dict>

so I should add these frames to SpriteFrameCache before
AnimationCache::getInstance()->addAnimationsWithFile("animations/animations.plist");
am I right?

2.There isn’t any tool to create these files as @dotsquid said,is there?

1 Like
#9

I believe you do need to add the frames to SpriteFrameCache before loading the animation plist.

I, unfortunately, do not know what tools might be available to create these animation plists. I did a little bit of googling and it seems like “SpriteHelper 2” might work, but the full version costs money and I haven’t tried out the trial version yet…

#10

Unfortunately, Sprite Helper is for MacOSX only.

#11

@libragagu My and your code to create sprite animation both gets executed successfully but all i can see is black screen. I have kept .plist file and png in resources folder. Where should i put it. What might be wrong here. Please help…M new to cocos2dx.