Controlling motion as actionscript 3

[Rick Gerard]

I have this project with a movie clip I'll call MyMovie. The movie is a simple tween. I also have a set of button controllers that will start, pause and rewind the movie when clicking on the icons. These icons are movie clips with instance names of goButton, pauseButton, etc.

I have no problem controlling the MyMovie animation with the icons until I convert the normal tween to action script.

I follow the normal procedure of coping the Motion to Actionscript 3, removing the tween, and making the animation play with the actionscript. But I can't figure out how to make the buttons control MyMovie. It looks like the instance of MyMovie isn't behaving like a tweened movie.

rewindButton.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler); function fl_MouseClickHandler(event:MouseEvent):void { MyMovie.gotoAndStop(1) }

Works fine with the action is tweened but when the motion is converted to actionscript it has no effect. Making MyMovie a child seems to have no effect. It seems like once the AnimatorFactory scripts start running the array's you can't stop them. I must be missing something simple. Anyone got any ideas?

[Ned Murphy]

What is the tween supposed to be doing, and what is the code that replaces the timeline version?

[Rick Gerard]

The tween simply moves a rectangle across the stage. Converting the motion to actionscript works just fine, I just loose control of the movie. It just plays.

Here's a shortened version of the motion. It's only 10 frames.

import fl.motion.AnimatorFactory; import fl.motion.MotionBase; import fl.motion.Motion; import flash.filters.*; import flash.geom.Point; var __motion_MyMovie:MotionBase; if(__motion_MyMovie == null) {     __motion_MyMovie = new Motion();     __motion_MyMovie.duration = 10;     // Call overrideTargetTransform to prevent the scale, skew,     // or rotation values from being made relative to the target     // object's original transform.     // __motion_MyMovie.overrideTargetTransform();     // The following calls to addPropertyArray assign data values     // for each tweened property. There is one value in the Array     // for every frame in the tween, or fewer if the last value     // remains the same for the rest of the frames.     __motion_MyMovie.addPropertyArray("x", [0,9.44444,18.8889,28.3333,37.7778,47.2222,56.6667,66.1111,75.5556,85]);     __motion_MyMovie.addPropertyArray("y", [0,10.5556,21.1111,31.6667,42.2222,52.7778,63.3333,73.8889,84.4444,95]);     __motion_MyMovie.addPropertyArray("scaleX", [1.000000]);     __motion_MyMovie.addPropertyArray("scaleY", [1.000000]);     __motion_MyMovie.addPropertyArray("skewX", [0]);     __motion_MyMovie.addPropertyArray("skewY", [0]);     __motion_MyMovie.addPropertyArray("rotationConcat", [0]);     __motion_MyMovie.addPropertyArray("blendMode", ["normal"]);     __motion_MyMovie.addPropertyArray("cacheAsBitmap", [false]);     // Create an AnimatorFactory instance, which will manage     // targets for its corresponding Motion.     var __animFactory_MyMovie:AnimatorFactory = new AnimatorFactory(__motion_MyMovie);     __animFactory_MyMovie.transformationPoint = new Point(0.500000, 0.500000);     // Call the addTarget function on the AnimatorFactory     // instance to target a DisplayObject with this Motion.     // The second parameter is the number of times the animation     // will play - the default value of 0 means it will loop.     __animFactory_MyMovie.addTarget(MyMovie, 4); }

The movie is set up to loop 4 times. I've tried using the __animFactory_MyMovie as the instance name for the mouse events. Neither works.

[Ned Murphy]

Yikes!  We'll see if we can replace all that with something shorter.  When you start the tween, is your expectation that it continuously tweens over and over again, or is it only supposed to play thru once?

[Rick Gerard]

That script is simply the copy motion as actionscript 3 from CS5.

I only set up the loop so that I would have time to test the buttons. In the completed projects I have 10+ items that animate over about 6000 frames. I need to control all items so that when the user clicks on a hotspot (button) they all stop. I have the project working just fine when the file has tweens for all the motion. The biggest problem I have is that the SWF is so heavy. If I convert the motion to actionscript then convert that motion to an xml file I get much faster loading times and a much smaller footprint. I can also then use that xml through a translator to bring the motion into HTML5 making my project mobile compatible.

I have everything working except stopping the playback of the motion as actionscript 3. It seems to me that I must be missing something very simple. Convert the motion in a movie 1 to actionscript, apply that action script to movie 2 and movie 2 follows the motion of movie 1. All is good, but there seems to be no way to do anything with the actionscript driven movie 2 except loop it forever or run it a specified number of times.

I hope this makes sense.

[Ned Murphy]

Whether or not it makes sense is secondary to it being a complete change from goals of the initial posting, so I'll leave you with the following, and maybe you can figure out how to adapt it to whatever you have planned.  It follows what I could make of your original problem statements/answers, assumes your answer to my last question was that it loops the tween continuously, and includes all of the controls' code.

Of course, there may be something else that hasn't been explained or I have missed that will make even this effort moot, but it's what I have to offer.

If you need to add more items into the fray, then consider using arrays if their tweening information varies, and tween them using a loop in the tweenMC function...

var startX:Number = 0;
var startY:Number = 0;
var endX:Number = 85;
var endY:Number = 95;
var frames:uint = 10;
var count:uint = 0;

// the tweening code

function tweenMC(evt:Event):void {
    MyMovie.x = count*(endX-startX)/(frames-1);
    MyMovie.y = count*(endY-startY)/(frames-1);
    count++;
    if(count == frames){
       count = 0;
    }
}

// the controls

function goClick(evt:MouseEvent):void {
    MyMovie.addEventListener(Event.ENTER_FRAME, tweenMC);
}

goButton.addEventListener(MouseEvent.CLICK, goClick);

function pauseClick(evt:MouseEvent):void {
    MyMovie.removeEventListener(Event.ENTER_FRAME, tweenMC);
}

pauseButton.addEventListener(MouseEvent.CLICK, pauseClick);

function rewindClick(evt:MouseEvent):void {
    MyMovie.removeEventListener(Event.ENTER_FRAME, tweenMC);
    MyMovie.x = startX;
    MyMovie.y = startY;
    count = 0;
}

rewindButton.addEventListener(MouseEvent.CLICK, rewindClick);

[Rick Gerard]

That's a really good answer but it doesn't solve the problem. My array comes from some motion tracking and the values go all over the place so I can't use a simple start and end position for X and Y. I have to be able to read the array that looks like this:

    __motion_hotspot1_8.addPropertyArray("x", [0,2.21888,7.41758,13.5327,20.0162,26.6326,33.2339,39.7338,46.0351,52.0521,57.691,62.8237,67.3023,70.9342,73.4703,74.6044,74.1563,72.6781,70.5397,67.9666,65.1064,62.0661,58.9237,55.7609,52.6437,49.6485,46.8731,44.4498,42.5793,41.5981,42.1143,44.0232,46.2467,48.7894,51.8029,55.9034,63.3102,71.8496,80.2946,87.6515,94.5137,100.472,106.224,111.826,117.444,122.803,129.969,138.594,146.364,152.832,158.684,164.424,170.083,175.683,181.183,186.663,191.625,198.882,207.661,214.152,218.185,220.824,222.611,224.123,226.194,228.59,231.34,234.59,238.828,244.763,251.07,257.449,264.388,271.937,280.257,288.993,294.513,298.716,302.746,306.633,310.395,313.95]);

    __motion_hotspot1_8.addPropertyArray("y", [0,11.7039,22.5016,32.8186,42.9143,52.9311,62.9419,73.0326,83.2411,93.6176,104.216,115.059,126.185,137.617,149.345,161.284,170.217,179.057,187.756,196.334,204.823,213.247,221.647,230.025,238.421,246.866,255.385,264.01,272.772,281.673,290.588,299.346,308.018,316.622,325.059,333.001,337.909,340.533,338.409,333.287,327.532,321.16,313.986,307.005,300.01,293.874,299.095,301.432,299.504,292.566,285.772,278.891,271.952,264.94,257.872,250.379,243.342,238.218,238.507,244.53,252.511,261.06,269.832,278.668,287.396,296.022,304.554,312.901,320.79,327.468,324.46,318.162,312.501,307.691,304.445,305.235,312.104,320.012,328.017,336.081,344.226,352.45]);

    __motion_hotspot1_8.addPropertyArray("scaleX", [1.000000]);

    __motion_hotspot1_8.addPropertyArray("scaleY", [1.000000]);

    __motion_hotspot1_8.addPropertyArray("skewX", [0]);

    __motion_hotspot1_8.addPropertyArray("skewY", [0]);

    __motion_hotspot1_8.addPropertyArray("rotationConcat", [0]);

Many of my tracks also include scale and rotation values.

The problem I'm facing is that I can't seem to figure out how to track or get the values sequentially from the array.

I'll dive into your code and see if I can adapt the ideas.

Thanks for trying.

[Ned Murphy · Accepted solution]

When the explanation goes from "The tween simply moves a rectangle across the stage." to what you just responded with... well, it isn't the first time this week I've had to tell someone when it comes to design requirements it's hard to hit a moving target.

The good news is my approach is almost readily adaptable to feeding it an array, though if your array sizes vary, then you'll have to figure out how to juggle that.

function tweenMC(evt:Event):void {
    MyMovie.x = arrayX[count];
    MyMovie.y = arrayY[count];
    count++;
    if(count == arrayX.length){ // start over
       count = 0;
    }
}

[Rick Gerard]

That's got the array stopped. Now I have another problem....

Look for a new post.