glassbean

SteppedEase to animate sprite with columns and rows

Recommended Posts

I am using stepped ease to animate a sprite and it works fine.

The problem i have is that there are so many frames that strip is now too wide and I need to have a grid of rows and columns of images

Is there a way of animating the y position incrementally as well the x position using the following:

 

TL.to(spriteSheet, 4, {x:-(spriteWidth * spriteNoOfFrames),ease:SteppedEase.config(spriteNoOfFrames)},"f1+=2.5" );

 

Thanks in advance... I really would love to use stepped ease since its so slimline compared with other js sprite animation code.

Share this post


Link to post
Share on other sites

For a grid you will most likely have to loop through each row and create a new SteppedEase tween and increment the y value OR just use a set() to put the background where you need it.

 

Here is one we had laying around:

 

 

and another from sesamechee

 

 

 

 

 

  • Like 3

Share this post


Link to post
Share on other sites

Tip of the day.

Changing the background position triggers a paint. x and y don't.

 

 

 

  • Like 4

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.