flux: A fast, lightweight tweening library

Showcase your libraries, tools and other projects that help your fellow love users.
rxi
Prole
Posts: 47
Joined: Sun Mar 02, 2014 10:22 pm

flux: A fast, lightweight tweening library

Post by rxi »

flux is a fast, lightweight tweening library for lua.

flux allows the user to easily interpolate a numerical value field of an object between its current value to a new value over a specified duration, using a specified easing type. If you want to do something like fade a sprite in or out, slide something onto the screen, gradually enlarge something or fade something from one color to another, flux provides a means of doing this with a single function call.

Image

Above is a 1 minute example .gif of flux tweening 900 little squares in different ways (the example's .love file is attached to this post).

Those who are familiar with tween.lua may be wondering what flux does differently. The most immediate difference is how a tween is created and how its optional settings are set. All optional settings for a tween are set using chained function calls rather than optional arguments. Flux also provides the chained functions after() for sequencing tweens, delay() for delaying the starting of a tween, and additional callback functions: onstart() and onupdate(). Flux provides groups which the uses for are listed in the README. In some small tests I've found flux's update call (where it updates the tweens each frame) runs at about 1.5x the speed of tween.lua, and is able to add 10,000 tweens at about 3x the speed.

Check out the README for instructions on setting up and using flux in your projects. The github page for flux is over here.
Attachments
900_tiny_squares.love
A small example, tweening lots of tiny squares
(2.67 KiB) Downloaded 980 times
User avatar
OttoRobba
Party member
Posts: 104
Joined: Mon Jan 06, 2014 5:02 am
Location: Sao Paulo, Brazil

Re: flux: A fast, lightweight tweening library

Post by OttoRobba »

That gif is mesmerizing.

Really cool library, gonna take a look into it :)
User avatar
qaisjp
Party member
Posts: 490
Joined: Tue Sep 04, 2012 10:49 am
Location: United Kingdom
Contact:

Re: flux: A fast, lightweight tweening library

Post by qaisjp »

that gif.... wow!
bonus points for using github
Lua is not an acronym.
User avatar
Raine
Prole
Posts: 1
Joined: Mon May 05, 2014 3:07 pm

Re: flux: A fast, lightweight tweening library

Post by Raine »

(just joined, hello everyone!)

Unbelievable how polished a simple quad array looks with tweening :awesome: thanks for sharing :)
User avatar
adnzzzzZ
Party member
Posts: 305
Joined: Sun Dec 26, 2010 11:04 pm
Location: Porto Alegre, Brazil

Re: flux: A fast, lightweight tweening library

Post by adnzzzzZ »

This is really cool, but there are easing functions missing. My favorite, in-out-cubic is not there (I checked the code and it's actually there but you forgot to add to the documentation). Also, onstart, onupdate, sineinout, etc should have proper capitalizing or separations, i.e. onStart, onUpdate, sineInOut or sine-in-out.

And one flaw that I don't see you mention anywhere and I couldn't figure out from the code: you don't return ids and you don't have a cancel function. This is a major major thing that I use all the time in my games (check here: https://github.com/adonaac/random/blob/ ... /Timer.lua). For instance:

Image

Does this:

Image

Without being able to tag and cancel previous tweens properly, whenever the changeHp function was called to change the player's HP, one tween would overwrite the changes being made by another tween and it would look really buggy. More importantly, in this particular example, there are two HP bars: the front one and the back one (lighter color). The back one only actually does the full tween after it's been 0.2 seconds that the player went without getting hit, and this gives it a nice effect. But this only happens because I'm able to cancel the 'change_hp_back_after' delay if the changeHP function gets called before the back HP bar starts tweening. In your library it could be written like (if it had ids or tags):

Code: Select all

function HPBar:changeHP()
    flux.cancel('change_hp')
    flux.cancel('change_hp_back')
    flux.to('change_hp', self, 0.2, {x_offset = self.w*(w.player.hp/w.player.max_hp)):ease('in-out-cubic')
    flux.to('change_hp_back', self, 0.2, {x_offset_back = self.w*(w.player.hp/w.player.max_hp)}):ease('in-out-cubic'):delay(0.2)
end
rxi
Prole
Posts: 47
Joined: Sun Mar 02, 2014 10:22 pm

Re: flux: A fast, lightweight tweening library

Post by rxi »

adnzzzzZ wrote:This is really cool, but there are easing functions missing. My favorite, in-out-cubic is not there (I checked the code and it's actually there but you forgot to add to the documentation). Also, onstart, onupdate, sineinout, etc should have proper capitalizing or separations, i.e. onStart, onUpdate, sineInOut or sine-in-out.

And one flaw that I don't see you mention anywhere and I couldn't figure out from the code: you don't return ids and you don't have a cancel function....
Good catch on the missing easing type in the docs! I've updated the README to include cubic easing now.

Also, thanks for explaining in such detail your need for cancelling tweens, including the handy images. I did something similar to what you're describing with labelled tweens in the past, though I didn't have plans to do this in flux.

Fortunately there is already a simple way to remove tweens, though not through the use of labels. The tween returned by the flux.to() function can be passed to the flux.remove() function to remove it immediately, causing it to stop at its current progress and never call its oncomplete() callback:

Code: Select all

local t = flux.to(self, 2, { x = 10 }):delay(2) -- Create a new delayed tween
flux.remove(t) -- Remove the tween immediately
You could set the tweens you create as a field on the self object and remove them before starting the new tween. If nil or a finished tween is passed to flux.remove() it will do nothing, so you don't have to worry about nil-checking the field where you're storing the tween before calling flux.remove(). This is another thing I realise isn't in the documentation.

On the matter of naming of the library functions / strings: This was a conscious decision, and a style I've committed to in all my lua libraries. The intention is to match the lua standard library's naming conventions (all lower case), seeing as every project is forced to some extend to use that style when using any of the standard library functions. If I were to use mixed case, it runs the risk of the user having to use both the style of the lua standard library, as well as a mixed case style when the user may be using neither of these, forcing their project to use 3 different naming styles rather than 2. I use mixed case in my own projects, but when writing open source lua modules I always use lower case for the reasons I mentioned.

Thanks for the input!
User avatar
Ranguna259
Party member
Posts: 911
Joined: Tue Jun 18, 2013 10:58 pm
Location: I'm right next to you

Re: flux: A fast, lightweight tweening library

Post by Ranguna259 »

Love it and I have a suggestion, how about an onupdatebefore and an onupdateafter ? This would really come in handy for zooming as I need the value of a number before and after the tweening update.
LoveDebug- A library that will help you debug your game with an on-screen fully interactive lua console, you can even do code hotswapping :D

Check out my twitter.
User avatar
Jasoco
Inner party member
Posts: 3725
Joined: Mon Jun 22, 2009 9:35 am
Location: Pennsylvania, USA
Contact:

Re: flux: A fast, lightweight tweening library

Post by Jasoco »

This impresses me. I am definitely going to make some use of this. I've wanted an animation morphing system for a while. Kind of like CoreAnimation on OS X.

Keep it coming.
Post Reply

Who is online

Users browsing this forum: No registered users and 18 guests