booglebop Posted June 9, 2010 Share Posted June 9, 2010 I'm attempting to create an animation that transforms the symbols around it's centerpoint in z-space, faking the appearance that it's spinning. Right now I'm trying to use the transform manager and using the following code: researchIntroAnim.insert(TweenMax.from(dollarSign, 0.25, {scaleX:0, scaleY:0, delay:1, transformMatrix:{skewY:-180}, ease:Back.easeOut})); This gets me half the "rotation" i'm looking for. Is there some way to repeat or yoyo this so that it appears to go all the way around? My goal is to have it spin 2-3 times and then stop. Note that this "spin" animation i'm looking for is part of a much longer timeline (researchIntroAnim) so it would need to somehow fit into a larger timeline as apposed to having it as it's own independent animation. I tried to create a separate timeline for just the spin and then nest that timeline inside the researchIntroAnim timeline but I wasn't able to figure out how it would work. I'm on a deadline so your help is greatly appreciated. Thanks and great work on a great product. Link to comment Share on other sites More sharing options...
GreenSock Posted June 10, 2010 Share Posted June 10, 2010 If you want to apply the easing across the whole animation (a series of several spins), you could create a repeated and yoyo'd TweenMax with a linear ease, pause it, and then tween that tween's totalTime value with whatever ease you want. Once you grasp the concept of tweening another tween, it's kinda cool and it opens up some new possibilities TweenPlugin.activate([TransformMatrixPlugin]); var cycles:uint = 3; var spinDuration:Number = 2; var tween:TweenMax = TweenMax.from(dollarSign, spinDuration * 0.5, {transformMatrix:{skewY:-180}, paused:true, repeat:cycles * 2 + 1, yoyo:true, ease:Linear.easeNone}); TweenLite.to(tween, cycles * spinDuration, {totalTime:tween.totalDuration - spinDuration, ease:Back.easeOut}); Link to comment Share on other sites More sharing options...
booglebop Posted June 10, 2010 Author Share Posted June 10, 2010 awesome! exactly what i was looking for. is there a way to set this up for multiple objects. ie: set all the specifics and then be able to easily call on it later whenever i need it, for any movieClip in a timeline sequence? again, i'm new to AS so i kinda need it pretty much spelled out. thanks! Link to comment Share on other sites More sharing options...
booglebop Posted June 15, 2010 Author Share Posted June 15, 2010 I've the spin working (via your code) but I'd like the "dollarSign" to scale from 0 to 100 while it's spinning. I can't figure out how or where to add this. Here's my attempt at a work around, that in theory I think should work, but it's not. Please advise. Thanks! var researchIntroAnim:TimelineMax = new TimelineMax(); //dollar sign in var cycles:uint = 3; var spinDuration:Number = 1; var spinTween:TweenMax = TweenMax.from(dollarSign, spinDuration * 0.5, {transformMatrix:{skewY:-180}, paused:true, repeat:cycles * 3 + 1, yoyo:true, ease:Linear.easeNone}); researchIntroAnim.insert(TweenMax.to(spinTween, cycles * spinDuration, {totalTime:spinTween.totalDuration - spinDuration, ease:Back.easeOut})) researchIntroAnim.insert(TweenMax.from(dollarSign, 1, {delay:0, scaleX:0, scaleY:0, ease:Back.easeOut})); Link to comment Share on other sites More sharing options...
GreenSock Posted June 16, 2010 Share Posted June 16, 2010 I suppose you could just nest it inside another Sprite so you could tween the scale of the container Sprite while the other animation is happening. Link to comment Share on other sites More sharing options...
booglebop Posted June 17, 2010 Author Share Posted June 17, 2010 Sounds like a good idea. In my limited knowledge of actionscript, my attempt is giving me an error: 1067: Implicit coercion of a value of type com.greensock:TimelineMax to an unrelated type flash.display:DisplayObject. Which I guess makes sense if "researchIntroAnim is not a display object. But then what do I add to the container sprite? var tweenContainer:Sprite = new Sprite(); var researchIntroAnim:TimelineMax = new TimelineMax(); var cycles:uint = 3; var spinDuration:Number = 1; var spinTween:TweenMax = TweenMax.from(dollarSign, spinDuration * 0.5, {transformMatrix:{skewY:-180}, paused:true, repeat:cycles * 3 + 1, yoyo:true, ease:Linear.easeNone}); researchIntroAnim.insert(TweenMax.to(spinTween, cycles * spinDuration, {totalTime:spinTween.totalDuration - spinDuration, ease:Back.easeOut})) tweenContainer.addChild(researchIntroAnim); TweenMax.from(tweenContainer, 1, {delay:0, scaleX:0, scaleY:0, ease:Back.easeOut}); Link to comment Share on other sites More sharing options...
GreenSock Posted June 17, 2010 Share Posted June 17, 2010 No no, you don't add a TimelineLite to the stage you put dollarSign into a Sprite. Use your original tween on dollarSign and do a new tween of the container Sprite to scale it however you want. Link to comment Share on other sites More sharing options...
booglebop Posted June 17, 2010 Author Share Posted June 17, 2010 I guess I'm confused on how to add something to a sprite Link to comment Share on other sites More sharing options...
GreenSock Posted June 17, 2010 Share Posted June 17, 2010 var mySprite = new Sprite(); mySprite.addChild(myOtherDisplayObject); Link to comment Share on other sites More sharing options...
booglebop Posted June 18, 2010 Author Share Posted June 18, 2010 I'm not sure what I'm doing wrong. It seems like whenever I add "dollarSign" to the sprite "tweenContainer" then test movie, the stage is just blank. What am I missing? import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; TweenPlugin.activate([TransformMatrixPlugin]); var tweenContainer = new Sprite(); tweenContainer.addChild(dollarSign); var researchIntroAnim:TimelineMax = new TimelineMax(); var cycles:uint = 3; var spinDuration:Number = 1; var spinTween:TweenMax = TweenMax.from(dollarSign, spinDuration * 0.5, {transformMatrix:{skewY:-180}, paused:true, repeat:cycles * 3 + 1, yoyo:true, ease:Linear.easeNone}); researchIntroAnim.insert(TweenMax.to(spinTween, cycles * spinDuration, {totalTime:spinTween.totalDuration - spinDuration, ease:Back.easeOut})); researchIntroAnim.insert(TweenMax.to(tweenContainer, 1, {scaleX:50, scaleY:50, ease:Back.easeOut})); Link to comment Share on other sites More sharing options...
GreenSock Posted June 19, 2010 Share Posted June 19, 2010 You forgot to add tweenContainer to the stage var tweenContainer = new Sprite(); tweenContainer.addChild(dollarSign); this.addChild(tweenContainer); Link to comment Share on other sites More sharing options...
booglebop Posted June 20, 2010 Author Share Posted June 20, 2010 Got it. Thankyou Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now