May 012011
 

How to use a sprite easily and effectively using Corona SDK.

That’s right! I’m a day late, I know, I said I’d do this for you in April – but it’s here now!

This tutorial has a sprite with four different sequences – it walks up, down, left and right.

You control it with a very simple D-pad and as you do the sprite will play accordingly, stopping when it isn’t in motion.

It is clearly commented so that you can understand the code and write something similar for your own iPhone app if you’re so inclined.

I am hoping this helps a lot of people, sprites used to confuse me horrible and I am only now starting to understand them properly.

Enjoy!

Peach Pellen :)

PS – If you haven’t liked Techority on Facebook yet, please do! Just click the box on the right ;)

DOWNLOAD IT HERE. CLICKY, CLICKY!

Like this post? Subscribe to the monthly newsletter!

 

  27 Responses to “Using Sprites In Your Corona iPhone Application”

  1. There are various joystick options, I’d suggest looking in the code exchange for samples. I believe there is a good one posted by Dunkel Games :)

  2. How can i display the analog joystick on touch event & also drag its functionality ….?

  3. Hi Peach, I would like to reference a particular sprite from the sprite sheet and use it as a button. Can you tell me how it can be done

    • Certainly – load the sprite normally, position it but don’t call play() – instead just just sprite.currentFrame = 1 (or whatever number the frame is you want for the button.)

      Make sense? :)

  4. Apparently that link didn’t work – the link that is. I fixed it after finding your post. Will go read it properly now :)

  5. Hi Peach, thanks for getting back to me so quickly! I posted up in the Corona forums at this post .

  6. Peach, your explanation is great, as everyone agrees. However, I wonder if I can set movement to a pixel amount, rather than a relative “speed” variable. I’ve been reviewing the corona documentation and can’t really find where movement/space is defined. Is this possible with your code? Thanks again!

    • Hey Homer,
      What you would do is rather than adjust speed is have hero.hero.x+1 or the like on each arrow. Rather than a Runtime listener you’d also just have it on the button in a touch event.
      If you post on the forum I can offer more guidance :)

  7. Peach, let me just add my voice here as well, I was struggling trying to make sense of the Corona documentation or sample code and was just ending up going in so many circles that I was getting dizzy. I decided to try to find a more clear example and yours couldn’t have been more clear or helpful. It literally took me minutes to get everything working once I saw your code after I’d spent hours with no progress. Thank you!

    • I really appreciate that feedback – thank you :)

      Sprites were something I really struggled with when I first tried to use them and any time I can help make it a bit easier for others, I’m happy.

  8. Hi Isak,

    I see! Yeah, I’m sorry, I don’t use Zwoptex or any of the others.

    I am glad you seem to be able to get the speed you want, although yes, I would encourage you to try making a sheet without Zwoptex if only for the experience :)

    Peach

  9. Hey Peach!

    Thanks for the reply, aa might be zwoptex i don’t know?

    I succeded to control the speed with timeScale it seemed to be able to set the speed i wanted:)

    Will try to make an sprite sheet without zwoptex and see if i get any different results:)

    /Isak

  10. Hi Isak,

    I don’t use Zwoptex so it is probably better to ask this in the Corona forum.

    Perhaps Zwoptex defines the speed elsewhere? I have never used it – but 3000 should be slow, not fast, you’re right.

    Peach

  11. Hello!

    I am struggling with sprite sheets, i have everything looping but it don’t seems like time in sprite.add works, i want my “animation” to go slower but its just as fast whatever i use in time

    require “sprite”

    local zwoptexData = require “testsheet”
    local data = zwoptexData.getSpriteSheetData()
    local spriteSheet = sprite.newSpriteSheetFromData( “testsheet.png”, data )

    –local sprite = sprite.newSpriteSheetFromData( “testsheet.png”, require(“testsheet”).getSpriteSheetData() )

    local spriteSet = sprite.newSpriteSet(spriteSheet,1,10)

    sprite.add(spriteSet,”test”,1,10,3000,0) –here i am trying to get the sprite animation to “change” image slower but it just goes lightning fast:S

    local spriteInstance = sprite.newSprite(spriteSet)

    spriteInstance.x = 200
    spriteInstance.y = 200

    –spriteInstance:prepare(“test”)
    spriteInstance:play(“test”)

    hoping someone can help me i am getting crazy at this:S

    Kind regards Isak

  12. Hi, good example ! it really helps!! however, how can I get this logic works for non-uniform sprite sheet?? I tried your code with a non-uniform sprite sheet, and the frame sequence seems wrong.

  13. Hey Jonathan,

    My apologies – it was my birthday on Friday and I’ve been just chilling and catching up on sleep since then, so I didn’t see this until now.

    Thank you for your kind words – I’m very happy you figured it out, although I’m sorry I wasn’t here sooner to assist.

    Thanks for sharing your info – I’m sure it will help others :)

    Peach

  14. Ok, I found another way.

    You can assign any field to your sprite.

    Using the sprite called HERO, assign it a field called anything you like – say, ID.

    You set ID as usual…

    Hero.ID = “MyHero”

    Then in your event handler code, you do this little trick…

    1
    2
    3
    if event.target.ID == "MyHero" then

    ...you've got the right sprite!!!

    The event.target passes back the object which the event occurred on, and from that you can get any properties that you set on that object. Clever!

    The documentation states:

    event.target

    “The display image object associated with the touch event. This value will be nil if this was called by a Runtime Touch event.”

    Being a noob, I did not realise that a sprite is just another display image object. And I did not appreciate that you can attach your own fields to any object, because of the freedom provided by LUA.

    Using this, you can have just one function that handles an event, and assign that one function to all your sprites – making sure that each sprite has a unique ID or name or whatever. Then you just check the ID and act accordingly.

    Hope this helps.

    JB

  15. Nope – that’s not it…:-(

    Any clues gratefully received.

    JB

  16. Hmm… I clearly didn’t read that documentation as well as I thought – how’s about event.sprite? Doh…

    I will go away and play with that for a while! :-)

    JB

  17. HI Peach

    Just posting to add my compliments to your sprite code. I too wandered lonely as a cloud through the Ansca Sprite reference stuff and did not have a clue what was going on. Within 10 minutes, I had sussed it out through your code, and had modified it to do some other stuff. Well done, very very useful – thank you!

    Further to that, I’ve also got my head round the event stuff thanks to your tutorials and templates.

    However, how would one handle a large number of sprites generated by a for…end loop?

    Your templates show different event handlers for each graphic object that you create, but to automate that how do you identify which sprite or graphic object has been touched so that you can have one Event handling function which handles all the items?

    I know that you can add an ID field to things like buttons and so on, but is there an equivalent way of handling things for code-generated objects? Again, I’ve trawled the Ansca documentation and can’t find anything.

    Thanks again for your tutorials – your site is the first place I head to now!

    Best regards

    JB

  18. I’ve spent a 2 day’s trying reading the ansca api ref. following the ansca video tutorials, and reading samples on the corona site. I was stumped. 2 minutes after I read through the main.lua you included I knew exactly how to do what I wanted. Very clear, and well documented.
    Thank you very much.

  19. Have you tried using newSpriteMultiSet at all?

    I can’t seem to make a clean transition from an anim on one sheet to another. Perhaps it is my code? I posted on the Ansca forum with code example, but haven’t seen any response.

    http://developer.anscamobile.com/forum/2011/05/04/bad-sprite-transition

    • I have not as I rarely use sprites at all.

      That said, I’ve been watching your thread hoping for a response from someone who does use sprites regularly and might have some tips about it.

      Hang in there; Ansca is pretty good about fixing the problems that pop up for users :)

      Peach

  20. Hey – always nice to see a familiar face commenting!

    Thanks for the kind words; honestly I struggled like MAD with sprites until quite recently, until it just “clicked” how it’s done and it all went smoothly.

    I hope this does indeed help people, it seems like such a simple thing – a sprite that plays dependent on d-pad button actions…. I might actually try submitting this to the code exchange later :)

    Peach

  21. Nice. I was just looking at the API’s and trying to figure out sprites, made my head hurt. Although I’m pretty sure I remember the basics. Anyone watching would’ve LTAO… “Huh? Oh… you tell it that x file is a sprite sheet… and then… uh… you divide it into sets for each character or object? Ok… then you divide that further into each character’s actions? D:” it took me an hour to get that far.

    If I have any trouble later when I try out sprites in a mini-platformer, at least I have someplace to go to get a better understanding. Thanks for your hard work Peach, I’m sure t’s saved many future Corona users a ton of pain and suffering. :D

 Leave a Reply

(required)

(required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Notify me of followup comments via e-mail. You can also subscribe without commenting.