Home
Username:
Password:
Adobe Flash ActionScript 3.0 for Designers Tutorials

Manipulating Graphics / Motion Tween Properties




Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com’s entire library of video tutorials.


Learn More

Subtitles of the Movie

Now when you copy ActionScripts from an existing motion tween animation built on the timeline in Flash the properties that are added to the generated script will depend on those properties that were involved in the original animation back in Flash. You can use the addPropertyArray method to customize these properties as well as to add new properties that weren't in the original animation. If you go to the ActionScript 3.0 Help area in Flash you can get a list of these tween properties that you can modify, so let me go through these properties in more detail in this movie starting with the X and Y positions. These are the horizontal and vertical positions of the transform point of the object. This will be related in the space of the parent object. Remember that X zero Y equals zero is the upper left-hand corner of that parent. Z is the depth or Z axis position, again in the coordinate space of the parent. ScaleX and scaleY is the horizontal and vertical scale as a percentage of the original object. SkewX and skewY is the skew angle of the original object and notice you can see many of these properties and how they're modified over time here. These are frames, remember, in this Array so the X and Y and the scaleX and scaleY are changing in each frame of this animation as defined here by these numbers, so again you can go in here and change those numbers to change the actual animation, modifying from the original. Next, we have the rotation properties: rotationX, rotationY. RotationX is the rotation of the object around the X axis from its original orientation. RotationY is around the Y axis. You also have this property, rotationConcat. This is the rotation around the Z axis. This is into and out of the Stage. Next, we have the useRotationConcat. If set, this causes the target object to rotate when the addPropertyArray supplies data for this motion. The blendMode property, we've seen this before. This provides a class value specifying the mixture of colors of an object with the graphics underneath. In this example here we can see that my blendMode here is set to normal. Next, we have the matrix3D; the matrix3D property, if one exists for the keyframe, is used for 3D tweens; all the previous transform properties will be ignored if you do use this property. Then you have the rotationZ property. This is, again, rotation into and out of the Stage in degrees from the original orientation relative to the 3D parent container. Again this is used for 3D tweens instead of rotationConcat. Let me now bring some of this theory down to earth with a concrete example. This code assigns values to the properties of a motion tween named underscore motion underscore Wheel. In this case the tween display object does not change location but rather spins in place throughout the 29 frames of the motion tween. The multiple values, notice, assigned to the rotationConcat Array define this rotation. Here are the values right here. Notice that all the other property values do not change for the X and Y location, scaling, the skewing, all zeros. Now the last task when working with these script-generated animations is to associate the motion tween with the display object or objects that it manipulates. The AnimatorFactory class manages this association. Remember it's an association between a motion tween and its target display objects. The argument to the AnimatorFactory constructor is the motion object. Here in this example it reads: animFactory underscore Symbol1 underscore 2:AnimatorFactory3D equals new animatorFactory3D with a parameter there notice that includes the object name, that's a classic constructor function right there. Notice the last line here is you're using the addTarget method of the AnimatorFactory class to associate the target display object with its motion tween. Here's where you would associate multiple display objects with the same motion tween using multiple calls to this addTarget method, right here, this line right here. Just add more of those to duplicate the same animation for other objects. That'll do it then for this very long section of this tutorial. on manipulating graphics. You've learned all about the Flash Display List model; display classes and important terms; how to change object position; how to modify colors and alpha with ActionScript; how to rotate, resize objects; how to script blending modes; how to add filtering display objects with ActionScript; how to mask display objects; customize the pointer; and also this last section here for converting tweens to ActionScript and then modifying that ActionScript to create custom animations. We're now ready for our next section of the tutorial, Controlling Audio and our next project, Project 5, the Music Jukebox.

Tutorial Information

Course: Adobe Flash ActionScript 3.0 for Designers
Author: James Gonzalez
SKU: 34060
ISBN: 1-935320-82-3
Release Date: 2009-11-09
Duration: 9.5 hrs / 101 lessons
Work Files: Yes
Captions: Available on CD and Online University
Compatibility: Vista/XP/2000, OS X, Linux
QuickTime 7, Flash 8

VTC Sign up & Benefits

  • Unlimited Access
  • 98,729 Video Tutorials (23,265 free)
  • Video Available as Flash or QuickTime
  • Over 1026 Courses
  • $30 for One Month Access
  • Multi-User Discounts Available