Motion tween using actionscript

Question

I'm pretty sure there has to be a way to do this. I want an
object to move to certain coordinates when certain objects are
moused over. Any help?

Answer 1

Bryan,
> Thank you so muck...honestly. I hate to ask for more
help,
> but i need to ask ONE more thing.
's okay. :)
> I got the movement working but the thing i need now is
for
> the puck to stay under the button when i mouse off.
Well ... okay, I looked at your code. Honestly, bro, it's a
complete
hodge-podge of new and old style coding. I know it's because
you're on
unfamiliar territory, and I'm not slammin' ya ... but really
-- really,
really, really -- your life will be soooo much easier if you
step back and
look at the big picture. Sooner or later, this will all gel
for you, and it
suddenly becomes very easy.
Forget that tellTarget() business. That's old; like, Flash 3
old. In
fact, it was deprecated in Flash 5. If you want to path to an
object, you
use its instance name. Of course, first, that means you need
to give your
relevant assets instance names. You've already done with with
the revolving
"police" lights -- but make sure you're consistent. Name them
light1,
light2, light3, and so on (yours were a bit dissheveled).
An instance name is just a "handle" that lets ActionScript
"talk" to a
given object. That light exists as a single movie clip symbol
in your
Library, but you want to talk to each one individually, so
each one gets its
own instance name.
Do the same thing with your "net" instance (the tab/button
movie clips).
Rather than this ...
tellTarget(this._parent.light4) {
gotoandplay(this._currentframe+70);
... just refer to objects by instance name.
light1.gotoAndPlay();
Much cleaner code. Now, this isn't relevant in your case,
but if that
"light" symbol had another movie clip inside it, you could
give *that*
symbol an instance name, too. For example, you might name the
bulb "bulb".
If you needed to instruct that bulb movie clip, you could
react it inside
each instance of light like this ...
light1.bulb.gotoAndPlay();
light2.bulb.gotoAndPlay();
// etc.
It's just like folders and subfolders on your hard drive.
Next, you've GOT to make sure you use the correct case.
gotoandplay
doesn't exist in ActionScript, but gotoAndPlay does.
Thankfully, the
ActionScript 2.0 Language Reference is only a click away, and
besides,
script code changes color to indicate when you've spelled
something
correctly.
Next, while it's perfectly legal to use the on() event
handler, it's
also pretty old. It was deprecated as of Flash MX (aka Flash
6), so use the
approach I showed you in previous posts. Just use the clip's
instance name
and assign a function to its event.
You want those instances of "net" to respond to mouse
events. I gave
each movie clip an instance name ... mcHome, mcCalendar,
mcRecord, and so
on.
This allows you to neatly put all your code into frame 1 of
the main
timeline. No more hunting and pecking, having to click on
each movie clip
separately, etc.
mcHome.onRollOver = function() {
// instructions here
That also means you don't have to keep repeating the import
statements
for each button. It's just much cleaner and more efficient.
Give yourself
a Scripts layer dedicated to scripts only, and put all your
code there.
Just remove all the on() stuff.
Now here's the part that should make a halogen bulb go BOOM
in your
head. I'll repeat what you were asking:
> I got the movement working but the thing i need now is
for
> the puck to stay under the button when i mouse off.
Okay. That means you want the puck not to start from its
original
position every time. (In your Tween instantiation, you were
always starting
from 66.3 -- which of course means that's where the puck will
start from
every time.) So, how are you going to know where the puck is?
Well, the puck is a movie clip -- so look up the MovieClip
class. The
MovieClip class lists a bunch of properties, which refer to
characteristics
of the object at hand. In other words, the MovieClip class
TELLS YOU what
properties are available to any movie clip out there --
because classes
define objects, and this is a movie clip object.
So if you need to know where the puck is horizontally, look
up its
MovieClip._x property. Badda bing.
mcHome.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 58, .5,
true);
light1.gotoAndPlay(2);
That puts the current _x value of the puck instance as the
fourth
parameter of that Tween constructor. Make sense? Here's
working code for
your Flash banner ...
import mx.transitions.Tween;
import mx.transitions.easing.*;
mcHome.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 58, .5,
true);
light1.gotoAndPlay(2);
mcHome.onRollOut = function() {
light1.gotoAndPlay(this._currentframe + 70);
mcHome.onRelease = function() {
getURL("site.php?page=press&links=home");
mcCalendar.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 215, .5,
true);
light2.gotoAndPlay(2);
mcCalendar.onRollOut = function() {
light2.gotoAndPlay(this._currentframe + 70);
mcCalendar.onRelease = function() {
getURL("site.php?page=press&links=home");
mcRecord.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 373, .5,
true);
light3.gotoAndPlay(2);
mcRecord.onRollOut = function() {
light3.gotoAndPlay(this._currentframe + 70);
mcRecord.onRelease = function() {
getURL("site.php?page=press&links=home");
mcTitans.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 533, .5,
true);
light4.gotoAndPlay(2);
mcTitans.onRollOut = function() {
light4.gotoAndPlay(this._currentframe + 70);
mcTitans.onRelease = function() {
getURL("site.php?page=press&links=home");
mcPressBox.onRollOver = function() {
new Tween(puck, "_x", Elastic.easeOut, puck._x, 688, .5,
true);
light5.gotoAndPlay(2);
mcPressBox.onRollOut = function() {
light5.gotoAndPlay(this._currentframe + 70);
mcPressBox.onRelease = function() {
getURL("site.php?page=press&links=home");
... keeping in mind, of course, that each instance of the
"net" movie clip
needs the relevant instance name, and that each instance of
the "light"
movie clip should be named as shown from left to right. NO
CODE exists as
attached to any movie clips. It's all in frame 1 of a new
layer named,
arbitrarily, scripts. The correct case is in use --
Elastic.easeOut, rather
than elastic.easeOut (or easeIn, whatever you prefer). And
make sure to
correc the getURL() parameter as needed.
> I owe you big time!
If you really feel that way, I do have an Amazon Wish List.
;) Write
me off line, if you're so inclined. I'll reply with your FLA.
You're under
NO obligation to buy me anything. I mean that. If the spirit
moves you, I
won't complain -- but write me so I know where to send you
your FLA. I
think seeing it will help you out.
David Stiller
Adobe Community Expert
Dev blog,
http://www.quip.net/blog/
"Luck is the residue of good design."