First time here? First time here? Newsletter Signup Newsletter
Login | Register | 651326 Members and growing!
Search tutorials
Author: Matt Byrnes | Website: http://www.inflash.com

Repositioning Pictures

Let's take a look at how the ActionScript handles repositioning the pictures.

Frame 8 contains the following code for when the "Right" button is pushed:
Set Variable: "leftmcX" = GetProperty ( "/leftmc", _x )
Set Variable: "centermcX" = GetProperty ( "/centermc", _x )
Set Variable: "rightmcX" = GetProperty ( "/rightmc", _x )
If (rightmcX>=(-1*rightmcwidth) and rightmcX<=stagewidth)
Set Property ("/rightmc", X Position) = rightmcX+10
Set Property ("/centermc", X Position) = (rightmcX-centermcwidth)+10
End If
If (leftmcX>=(-1*leftmcwidth) and leftmcX<=stagewidth)
Set Property ("/leftmc", X Position) = leftmcX+10
Set Property ("/rightmc", X Position) = (leftmcX-rightmcwidth)+10
End If
If (centermcX>=(-1*centermcwidth) and centermcX<=stagewidth)
Set Property ("/centermc", X Position) = centermcX+10
Set Property ("/leftmc", X Position) = (centermcX-leftmcwidth)+10
End If
Play




First, the computer determines what the position each movie clip is at on the X-axis. It takes that position and stores it in a variable.
Set Variable: "leftmcX" = GetProperty ( "/leftmc", _x )
Set Variable: "centermcX" = GetProperty ( "/centermc", _x )
Set Variable: "rightmcX" = GetProperty ( "/rightmc", _x )

Thus, the X position of the the movie clip "/leftmc" is stored in the variable, "leftmcX."

Next the computer looks at whether any part of the movie clip is on the stage, starting with the right movie clip.
If (rightmcX>=(-1*rightmcwidth) and rightmcX<=stagewidth)
Set Property ("/rightmc", X Position) = rightmcX+10
Set Property ("/centermc", X Position) = (rightmcX-centermcwidth)+10
End If


Let's look at the first section of the conditional:
If (rightmcX>=(-1*rightmcwidth)

This part of the script is asking, is the movie clip as far left as it is wide? If we take the X position and add the width of the movie clip to the X position, will the tail of the movie clip be on the stage? In other words, if the movie clip's X position is -500, that means it's X position is way off the stage. But if the movie clip is 600 pixels long, that means there are 100 pixels of the movie clip still on the stage. If it's still on the stage it has to be repositioned.

You might be asking yourself, "why is a -1 being multiplied times the width of the movie clip?" I'll try my best to explain it, but math isn't my strong suit, much less being able to explain things in mathematical terms. We're testing to see how close to zero the movie clip's tail end position is when the movie clip is set at the current "X" position. We're only concerned with how far left the movie clip is, and far left is below zero, below zero is a negative number. Thus, we need to convert the movie clip to a negative number to make a correct comparision.

If (rightmcX>=(-1*rightmcwidth)


If the X position is closer to zero, return true, if the movie clip width as a negative number is closer to zero, that means it's off the stage and false is returned, and we don't care about it.

The second part of the conditional test:

and rightmcX<=stagewidth)

checks to see if the X position is left of the far right side of the stage. Assuming a stage 540 pixels wide, this could be any number less than 540. If the X position is over 540, skip to the next conditional test. If it is under, then both parts of the conditional test return true and the movie clip must be repositioned for the viewer:

Set Property ("/rightmc", X Position) = rightmcX+10
Set Property ("/centermc", X Position) = (rightmcX-centermcwidth)+10



Just add 10 pixels to the movie clip's X position in the above script and presto! A scrolling effect.

But what's this here: (rightmcX-centermcwidth)+10

The tricky part here is that we're moving the movie clips according to their X position, but we're aligning the tail end of one movie clip to the X position (beginning) of another.

So how do we do this?

We can determine the tailend position of a movie clip by taking it's X position and adding that number to the movie clip's width. Thus, a movie clip with an X position of 100 that is 500 pixels wide would have a tail end that would land on the X axis at 600.

That gives us access to lining up the tail end of one movie clip with the X position of another movie clip.

For example, take the center movie clip (centermc) and the right movie clip (rightmc). The computer takes the X position of the right movie clip, we'll say it's 200, subtract that from the width of the center movie clip, we'll say that's 1000, and we get -800. -800 is the x position of the center movie clip for perfect alignment with the right movie clip.



Since the pictures are constantly being positioned relative to one another, it's necessary to line them up at the beginning in perfect alignment. If they're out of aligment to begin with, they'll be perfectly out of alignment throughout. The starting positions are the absolutes that all the relative re-positioning are based on.

To finish up the rest of the conditional statements in the keyframe, which is basically a rehash of everything above.:

The computer checks the position of each movie clip to the other and will perform the same operations as above if the condition returns true.
If (rightmcX>=(-1*rightmcwidth) and rightmcX<=stagewidth)
Set Property ("/rightmc", X Position) = rightmcX+10
Set Property ("/centermc", X Position) = (rightmcX-centermcwidth)+10
End If
If (leftmcX>=(-1*leftmcwidth) and leftmcX<=stagewidth)
Set Property ("/leftmc", X Position) = leftmcX+10
Set Property ("/rightmc", X Position) = (leftmcX-rightmcwidth)+10
End If
If (centermcX>=(-1*centermcwidth) and centermcX<=stagewidth)
Set Property ("/centermc", X Position) = centermcX+10
Set Property ("/leftmc", X Position) = (centermcX-leftmcwidth)+10
End If
Play


Each If statement checks to see if the X position returned indicates any part of the movie clip is on the stage. If the movie clip has any part of itself on stage, then that movie clip is moved to the right 10 pixels. The movie clip to the left of it gets moved to the right 10 pixels as well. (To move the pictures to the left, the movie clips would be repositioned 10 pixels to the left).

Everything gets positioned relative to everything else. However, there are a two absolutes that make all this relativity possible:

The tour starts with leftmc's tailend aligned seamlessly with the beginning of centermc, and centermc's tailend aligns seamlessly with the beginning of rightmc.

At some point, the tailend of rightmc will align seamlessly with the beginning of leftmc.

By programming the code this way, the computer can manage the presentation itself, without you having to re-calculate everything everytime you import new panoramic pictures into the .fla.

» Level Advanced

Added: 2001-05-31
Rating: 7.76 Votes: 95
(10 being the highest)
» Author
No details available.
» Download
Download the files used in this tutorial.
» Forums
More help? Search our boards for quick answers!

Comments

  • There are no comments yet. Be the first to comment!

  • You must have javascript enabled in order to post comments.

Leave a Comment
  • Your email address will not be published. All fields are required.
Featured Flash FLA
» Author: Inocreato
» Title: RaiseTheBlocks
» Description: Raise all the blocks to win the game
Featured Sound Loops
Image for equalize

Audio Player

» Author: TomCat Carty
» Title: The Wood
» Description: Just a little game ending or it can maybe be looped. Recorders with music box and percussion to give the feel of well, I don't know, the woods? Free to use, just credit me. thank you
Latest Font
» Author: Fábio FAFERS
» Description: I created this font for free use. Everyone can apply it in personal or business texts. Its free, but I want to be communicated in case of business use. Donations are accepted to keep the project of free fonts alive! Thank you all
Featured Sound Fx
Image for equalize

Audio Player

» Author: Davisigner
» Description: Hmm... what to say about this one? It's reminiscent of the closing notes of the opening music from the Three Stooges done in a church organ style with a closing cymbal crash. I'll give this one away gratis, but feel free to check out my free loops and potential upcoming license-mandated ones over in the respective part of Flashkit.