How to Use Animations and Sprite Sheets in Cocos2D 2.X

Discussion of the official tutorials published on raywenderlich.com. Please only discuss the official tutorials here - for general questions, use the General Discussion forum instead.

How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby rwenderlich » Tue Mar 12, 2013 10:33 am

This is the official thread to discuss the following blog post: How to Use Animations and Sprite Sheets in Cocos2D 2.X
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
Ray Wenderlich
Blog: http://www.raywenderlich.com
Twitter: http://twitter.com/rwenderlich
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
User avatar
rwenderlich
Team Member
Site Admin
 
Posts: 2221
Joined: Thu Dec 23, 2010 4:14 pm
Has thanked: 28 times
Been thanked: 359 times

Re: How To Use Animations and Sprite Sheets in Cocos2D 2.X

Postby duracellrabbid » Wed Mar 13, 2013 2:19 am

Hi,

I realized that you set the Trimming option to "None". In actual fact, you can leave it as "Trim" to reduce the amount of space taken by the sprites in the spritesheet. The plist generated will specify the offsets so when the sprite is rendered, the positioning of the sprite will still be the same. I used this technique for my UI placements.
duracellrabbid
Hacker
 
Posts: 19
Joined: Tue Mar 29, 2011 6:24 am
Has thanked: 0 time
Been thanked: 0 time

Re: How To Use Animations and Sprite Sheets in Cocos2D 2.X

Postby SBCGames » Fri Mar 15, 2013 6:01 pm

Hello,

some time ago we created our own Sprite Atlas tool called PicOpt. It does not have such a nice look as Texture Packer, but it is free. It allows you also to add custom properties and it can automatically extract frames from picture with sprites in single-color grid. From such pictures you can crete your project and then export all the frames into one sprite sheet. Duplicate pictures are also checked and removed on export. You can also decide whether to include some free space between frames in final export or whether to repeat border and so on. Finally you can create simple animations with it.

The description of the tool as well as download is present at http://sbcgamesdev.blogspot.com/2012/10/sprite-atlas-tool-part-i-creating-atlas.html

In second part there is description of the data export: http://sbcgamesdev.blogspot.com/2012/10/sprite-atlas-tool-part-ii-data-exports.html

The tool is written in Java and it is far from perfect but we already finished few games with it...
User avatar
SBCGames
n00b
 
Posts: 2
Joined: Fri Mar 15, 2013 5:52 pm
Has thanked: 0 time
Been thanked: 0 time

Re: How To Use Animations and Sprite Sheets in Cocos2D 2.X

Postby hensal » Wed Mar 27, 2013 8:38 am

Hi, I have a question about the scaling you're doing in this tutorial using the AutoSD functionality in TexturePacker. For me it seems to be using the wrong scale factors, or am I misunderstanding something.. ? The AutoSD template is scaling down an -ipadhd sized image by 50% to create a -hd version, which seems wrong to me, and it doesn't create an -ipad version like the template name suggests. Is this TexturePacker template wrong or am I missing something? For me the correct extensions and sizes to scale down to from an -ipadhd original would be something like this,

-ipad: 0.5
-hd: 0.41667
(sd): 0.20833

Am I'm misunderstanding this functionality in TexturePacker?

Thanks in advance!
hensal
n00b
 
Posts: 1
Joined: Wed Mar 27, 2013 8:26 am
Has thanked: 0 time
Been thanked: 0 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby GumbiRo » Wed Apr 24, 2013 5:30 pm

Are there any other programs similar (but FREE) to Texture Packer? I mean..I wouldn't want a red bear in my app now would we? hahaha

Thanks! :D



EDIT


I just read a comment above about a similar program, I'll try it out but if you guys have one thats better Im all ears!
If you need something translated to spanish, let me know! :D
User avatar
GumbiRo
Uber Haxx0r
 
Posts: 96
Joined: Sun Oct 21, 2012 3:18 pm
Has thanked: 31 times
Been thanked: 1 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby sir_seagill » Mon May 06, 2013 11:40 pm

according to that video.... we should definitely be turning trimming off.

I downloaded Zwoptex because that was in the old tutorial... lol
Mark W - A causal Flash designer now learning cocos2d (let the fun begin ^_^)
User avatar
sir_seagill
Hacker
 
Posts: 15
Joined: Sat Dec 25, 2010 10:57 am
Has thanked: 1 time
Been thanked: 0 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby hsyed44 » Sun May 12, 2013 3:53 am

Hello all.

my query is: What if i want the bear to only move along the x axis and not the y?

i've been trying to work at this all day but haven't figured it out. I m guessing it has to do with the CGPoint moveDifference but i can't find a function or come up with a formula to have the bear or well the animation i m using to just move on the x axis and not leave the screen.

any help would be appreciated :)
hsyed44
n00b
 
Posts: 3
Joined: Sat Nov 17, 2012 8:31 am
Has thanked: 0 time
Been thanked: 0 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby Colton3310 » Mon May 13, 2013 6:21 am

Thanks. But I would like to find the tool to make my own animated slideshow. Where I can find it?
I'm a freelancer and very glad to share awesome digital photo albums with you.
Tips: To Create a flash slideshows with Kvisoft Flash Slideshow Maker
Welcome to my blog:
http://video-tools.overblog.com/
Colton3310
n00b
 
Posts: 4
Joined: Fri Apr 26, 2013 1:37 am
Location: New York,United States
Has thanked: 0 time
Been thanked: 0 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby GumbiRo » Mon May 13, 2013 2:41 pm

@hsyed44
Hello all.

my query is: What if i want the bear to only move along the x axis and not the y?

i've been trying to work at this all day but haven't figured it out. I m guessing it has to do with the CGPoint moveDifference but i can't find a function or come up with a formula to have the bear or well the animation i m using to just move on the x axis and not leave the screen.


What you do here is:

You take coordinates using TouchDispatcher...(x & y)

So Im just taking a wild guess, try doing this:


Code: Select all
self.moveAction = [CCSequence actions:
    [CCMoveTo actionWithDuration:moveDuration position:touchLocation.x],
    [CCCallFunc actionWithTarget:self selector:@selector(bearMoveEnded)],
    nil];


Tell me if this works! , I hope that does it for you!
If you need something translated to spanish, let me know! :D
User avatar
GumbiRo
Uber Haxx0r
 
Posts: 96
Joined: Sun Oct 21, 2012 3:18 pm
Has thanked: 31 times
Been thanked: 1 time

Re: How to Use Animations and Sprite Sheets in Cocos2D 2.X

Postby GumbiRo » Wed May 15, 2013 4:21 pm

Nevermind on what I said.

What you could do is create a point that resembles the same 'Y' as your bear and the new 'X'.

So something like :

Code: Select all
CGPoint newPoint = ccSub(touchpoint.x,bear.y)


Or something similar...I'd have to test it out but Im kind of having a few problems of my own when it comes to animations...
If you need something translated to spanish, let me know! :D
User avatar
GumbiRo
Uber Haxx0r
 
Posts: 96
Joined: Sun Oct 21, 2012 3:18 pm
Has thanked: 31 times
Been thanked: 1 time

Next

Return to Official Tutorials

Who is online

Users browsing this forum: No registered users and 8 guests