HydroTween + HydroSequence rev37
UPDATE: rev39, synced up with the 0.5.0 updates. Matrix tweening and some bug fixes. Fixed callback error from previous updates
Fuse style functionality has been moved from HydroTween to a separate class called HydroSequence! This decision was made to offer an easier and more flexible way to control sequences by having clearer access to SequenceCA super methods. Also makes it easier to enhance the functionality of the sequencing parser. Here is the new syntax:
{target:fusebox, x:320, duration:1, easing:Quadratic.easeInOut},
{target:fusebox, Blur_blurX:8, Blur_blurY:8, duration:1, easing:Quadratic.easeInOut},
{target:fusebox, color:0×0000FF, duration:1, easing:Quadratic.easeInOut},
{target:fusebox, Blur_blurX:0, Blur_blurY:0, duration:.8, easing:Quadratic.easeInOut},
{target:fusebox, x:400, duration:.5, easing:Quadratic.easeInOut}
);
seq1.addItem([{target:fusebox, rotation:270, duration:3, easing:Quadratic.easeInOut}, {func:trace, args:["HELLO WORLD"]}]);
seq1.start();
Grouped Array targets are supported and the ability to add sequence objects with the addItem() method as well as using the constructor to create sequences.
In other news, I added a frame property to HydroTween which has been added to the demo swf here:
Also check out the GO Playground
Some extra advanced features from SequenceCA and beyond:
Duration Advance:
[
{
target:target,
x:400,
y:40,
Blur_blurX:32,
Blur_blurY:32,
DropShadow_distance:16,
DropShadow_alpha:16,
rotation:180,
start_alpha:.5,
alpha:1,
scaleX:5,
scaleY:5,
color:0×0000FF,
useRelative:true,
duration:1, // Note Duration is 1. When this finsishes, it waits for the other group item.
easing:Quintic.easeIn
},
{
target:target2,
x:300,
Blur_blurX:0,
Blur_blurY:0,
scaleX:1,
scaleY:1,
color:HydroTween.RESET,
duration:1, // Note Duration is one, but…
repeater:new LinearGoRepeater(2), // Repeater creates a 1 second tween * 2.
easing:Quintic.easeInOut
}
]);
// Here we add an advance property and instantiate an OnDurationComplete Object to tell
// the sequence to skip ahead after 1 second instead of waiting for the full duration of
// the sequence Object/item
goItem.addItem({target:[target,target2], advance:new OnDurationComplete(1), alpha:0, duration:6});
goItem.addItem({target:[target,target2], alpha:1, duration:1});
// Another grouped sequence Object/item with a function call
goItem.addItem([{target:[target,target2], x:10, duration:1},{func:trace, args:["Start x tween"]}]);
goItem.addItem({func:trace, args:["Sequence Complete"]});
goItem.start();
HydroTween + HydroSequence Source and Example
HydroTween + HydroSequence Source Only
July 30th, 2008 at 9:18 am
Just dropping by to tell you that you are awesome. Thank you for helping to fill the painful hole left in many as3 developers' lives by a conspicuous lack of Fuse 2 equivalent for as3.
August 2nd, 2008 at 7:30 pm
[...] to kick things off, here's a comparison of Tweener, TweenLite, ZigoEngine (Fuse), Twease, HydroTween, and Adobe's built-in Tween class: (select a tweening engine and click the [...]
August 5th, 2008 at 5:54 pm
Indeed, this is truly great. Only thing I miss is the string shortcuts for relative value tweening (I know you can use "useRelative" but that applies to all values).
e.g. {target:box_mc, alpha:0.5, x:"10″}
August 7th, 2008 at 5:59 am
This has been added. Should make it's way to the next update in a matter of days.
August 16th, 2008 at 11:40 pm
image tweening part seems doesn't work in example as well as in code, I've tried Tint tweening
great work, respect
August 17th, 2008 at 1:00 am
color also works very strange,
as long as you use 0xff000, 0×00ff00 … it tweens to that color, but if I try for example 0×8f62ac it does not tween to that color
I suppose color property should work just like flash.geom.ColorTransform ?
August 17th, 2008 at 4:07 pm
I removed tinting as it isn't truly functional and there's a bug. Will add that back in as soon as I get a chance to fixe and finish that.
August 17th, 2008 at 4:10 pm
color vals bug has been fixed in rev 42. HydroTween actually uses ColorMatrix to tween to a hex value. Give it a shot. It's possible color space settings might give slightly different results, but I'm getting exact values when comparing in Photoshop.
Rev 42 is located on the SVN as well as the download link:
http://code.google.com/p/goplayground/
Let me know how that works for you.
August 23rd, 2008 at 1:31 am
[...] HydroTween + HydroSequence (based on GoASAP)http://blog.hydrotik.com/2008/07/19/hydrotween-hydrosequence-rev32/ [...]
August 24th, 2008 at 2:24 am
[...] HydroTween + HydroSequence (based on GoASAP) http://blog.hydrotik.com/2008/07/19/hydrotween-hydrosequence-rev32/ [...]
August 27th, 2008 at 8:40 pm
[...] hydrotik [...]
September 1st, 2008 at 9:24 am
Great work here Donovan, thanks so much for sharing it with us!! I was looking at your example files and it seems you're usually importing all the org.goasap classes to your doc class for implementation. They don't need to be because you're extending them from yours, they're automatically inherited. If they don't have goasap, your classes wouldn't compile anyway.
So for the doc class, simply:
import com.hydrotik.go.HydroTween;
import com.hydrotik.go.HydroSequence;
import fl.motion.easing.*;
import flash.display.MovieClip;
October 18th, 2008 at 7:46 am
[...] HydroTween + HydroSequence (based on GoASAP) http://blog.hydrotik.com/2008/07/19/hydrotween-hydrosequence-rev32/ [...]