Tweening Via a Function

[booglebop]

Hi,

 

I'm not sure why this doesn't work. If I put the entire "myTimeline" inside "myFunction" it seems to work, but that's not what I need. It's probably something simple I'm missing. FYI this is AS2. Also my code is a bit more complex, this is just to illustrate the concept I'm struggling with. Thanks!

 

var myTimeline:TimelineMax = new TimelineMax({paused:true});
myTimeline.append(TweenMax.to(MC_1, 1, {_xscale:100, _yscale:100, ease:Expo.easeOut}));
myTimeline.append(TweenMax.to(MC_2, 1, {_xscale:100, _yscale:100, ease:Expo.easeOut}));

function myFunction() {
myTimeline.play;
}
myButton.onRelease = myFunction;

[GreenSock]

Sounds like a scope issue which plagued AS2 (it's not an issue in AS3). Basically, when you attach mouse events to an object, the scope inside that function will be the object. Like:

 

this._name = "MAIN";
myButton._name = "BUTTON";
myButton.onRelease = myFunction; //onRelease, traces "BUTTON"
function myFunction():Void {
   trace(this._name); 
}
myFunction(); //traces "MAIN"

 

So the function gets confused about what "this" refers to and where to look for variables/properties, etc.

 

You can get around this by using the mx.utils.Delegate like:

 

myButton.onRelease = Delegate.create(this, myFunction);

[booglebop]

Thank you very much. You're example works, but it doesn't seem to be taking in my code. I've got to be close. Any ideas?

import mx.utils.Delegate;
import com.greensock.*;
import com.greensock.easing.*;

var myTimeline:TimelineMax = new TimelineMax({paused:true});
myTimeline.append(TweenMax.to(MC_1, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));
myTimeline.append(TweenMax.to(MC_2, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));

function myFunction() {
  myTimeline.play;
}
myButton.onRelease = Delegate.create(myTimeline, myFunction);

[GreenSock]

You're missing "()" after play and you used the wrong scope.

 

import mx.utils.Delegate;
import com.greensock.*;
import com.greensock.easing.*;

var myTimeline:TimelineMax = new TimelineMax({paused:true});
myTimeline.append(TweenMax.to(MC_1, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));
myTimeline.append(TweenMax.to(MC_2, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));

function myFunction() {
  myTimeline.play();
}
myButton.onRelease = Delegate.create(this, myFunction);

[booglebop]

You're missing "()" after play and you used the wrong scope.

 

import mx.utils.Delegate;
import com.greensock.*;
import com.greensock.easing.*;

var myTimeline:TimelineMax = new TimelineMax({paused:true});
myTimeline.append(TweenMax.to(MC_1, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));
myTimeline.append(TweenMax.to(MC_2, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}));

function myFunction() {
  myTimeline.play();
}
myButton.onRelease = Delegate.create(this, myFunction);

 

Thank you! You've been a lifesaver for me during this project I'm currently working on and in my early learning of AS and timelineMax/Lite. While we're on the subject, how could I pass MC_3 to myTimeline inside of myFunction? This way I would have myTimeline and myFunction created once and then be able to change the MC that I want to tween via another function. Hope that makes sense.

[GreenSock]

Not sure I understand the question. Are you trying to plug a tween of MC3 into the timeline? Are you trying to do the same tween for any MovieClip and just use a variable to do it?

[booglebop]

I thought those were one in the same thing. I guess I'd like to know how to do both. I'm trying to learn ways to cut down on repetitive code.

[GreenSock]

var myTimeline:TimelineLite = new TimelineLite({paused:true});

//anytime you want to insert the same kind of scale tween for any MovieClip, use this function.
function addCustomTween(mc:MovieClip, timeline:TimelineLite):Void{
   timeline.insert( TweenMax.to(mc, 1, {_xscale:50, _yscale:50, ease:Expo.easeOut}), timeline.currentTime);
}

addCustomTween(mc1, myTimeline);
addCustomTween(mc2, myTimeline);
...and so on

 

I'm still not sure what else you're asking, but hopefully this gives you a nudge in the right direction.