(12 votes, average: 4.25 out of 5) 
Loading ...Understanding the basic display object properties like x, y, width, height etc... is imperative for anyone interested in intermediate level ActionScript. It's important to practice using properties until you understand them well enough to solve problems using them. If you're not comfortable with properties yet, you should read through Chapter 3 and then try the exercises in the Property Practice (simple motion) post.
One of the more common things you'll find yourself doing with properties is using them to position display objects relative to one another.
If you have three arbitrarily placed movie clips on your stage, box0, box1 and box2...
...you can align them by putting the following code on your main timeline:
// alignment code box0.x = 100; box0.y = 100; // position box1 based on box0's x and width properties box1.x = box0.x + box0.width; box1.y = box0.y; box2.x = box1.x + box1.width; box2.y = box1.y;
Clips aligned with code
The power of this kind of relative alignment may not be immediately apparent from looking at the code. However, try changing the width of one of the boxes, and then test your movie again:
Relatively positioned clips remain properly aligned
The clips are still aligned despite having different width values. Continuously aligning clips on an enter frame event opens up some different possibilities:
Roll over each box:
Download align_nav_1.fla (6.9 KB, 985 hits)
Above we've used the align technique to create a row of dynamically resizing buttons. Here's the code:
-
box0.x = 20;
-
box0.y = 20;
-
-
setupRollOver(box0);
-
setupRollOver(box1);
-
setupRollOver(box2);
-
-
function setupRollOver(mc:MovieClip):void {
-
// add a local variable to each clip for use with Zeno's paradox
-
mc.scaleDest = 1;
-
mc.buttonMode = true;
-
mc.addEventListener(MouseEvent.ROLL_OVER, onOver, false, 0, true);
-
mc.addEventListener(MouseEvent.ROLL_OUT, onOut, false, 0, true);
-
mc.addEventListener(Event.ENTER_FRAME, onScale, false, 0, true);
-
}
-
-
function onScale(evt:Event):void {
-
var mc:MovieClip = MovieClip(evt.target);
-
mc.scaleX += (mc.scaleDest - mc.scaleX) / 4;
-
}
-
-
function onOver(evt:MouseEvent):void {
-
evt.target.scaleDest = 3;
-
}
-
-
function onOut(evt:MouseEvent):void {
-
evt.target.scaleDest = 1;
-
}
-
-
addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);
-
-
function onLoop(evt:Event):void {
-
// align all clips
-
box1.x = box0.x + box0.width;
-
box1.y = box0.y;
-
box2.x = box1.x + box1.width;
-
box2.y = box1.y;
-
}
In the above code the setupRollOver function adds listeners to each box causing their scaleX property to grow to 300% when a roll over event is received. Lines 31-39 run the previously discussed alignment code each time an enter frame event occurs so that the clips remain aligned at all times.
Expanding the Example
If we wanted to add a box to this example, we'd have to duplicate a bit of code and drag out a new box instance from our Library. If we wanted to have ten boxes, our align code would start to look very repetitive:
box1.x = box0.x + box0.width; box1.y = box0.y; box2.x = box1.x + box1.width; box2.y = box1.y; box3.x = box2.x + box2.width; box3.y = box2.y; box4.x = box3.x + box3.width; box4.y = box3.y; box5.x = box4.x + box4.width; box5.y = box4.y; box6.x = box5.x + box5.width; box6.y = box5.y; box7.x = box6.x + box6.width; box7.y = box6.y; box8.x = box7.x + box7.width; box8.y = box7.y; box9.x = box8.x + box8.width; box9.y = box8.y;
Let's take a look at how we can get rid of that repetitive code and make the number of boxes in our navigation completely dynamic:
-
// changes the number of boxes in the navigation
-
var boxNum:int = 8;
-
-
// for more control we put all our boxes in one movie clip
-
// we store a reference to that clip in a variable called nav
-
var nav:MovieClip = new MovieClip();
-
nav.x = 20;
-
nav.y = 20;
-
addChild(nav);
-
-
// our boxes are pulled out from the Library, positioned,
-
// added to the display list and passed to setupRollOver
-
for (var i:int = 0; i <boxNum; i++) {
-
var b:MovieClip = new Box();
-
b.x = b.width * i;
-
nav.addChild(b);
-
setupRollOver(b);
-
}
-
-
function setupRollOver(mc:MovieClip):void {
-
mc.scaleDest = 1;
-
b.buttonMode = true;
-
mc.addEventListener(MouseEvent.ROLL_OVER, onOver, false, 0, true);
-
mc.addEventListener(MouseEvent.ROLL_OUT, onOut, false, 0, true);
-
mc.addEventListener(Event.ENTER_FRAME, onScale, false, 0, true);
-
}
-
-
function onScale(evt:Event):void {
-
var mc:MovieClip = MovieClip(evt.target);
-
mc.scaleX += (mc.scaleDest - mc.scaleX) / 4;
-
}
-
-
function onOver(evt:MouseEvent):void {
-
evt.target.scaleDest = 3;
-
}
-
-
function onOut(evt:MouseEvent):void {
-
evt.target.scaleDest = 1;
-
}
-
-
addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);
-
-
function onLoop(evt:Event):void {
-
// loop through all boxes and position them
-
for (var i:int = 1; i <boxNum; i++) {
-
var b:MovieClip = MovieClip(nav.getChildAt(i));
-
var prev:MovieClip = MovieClip(nav.getChildAt(i-1));
-
b.x = prev.x + prev.width;
-
}
-
}
We've reduced the amount of work needed to change the number of boxes down to the variable boxNum. On line 6 we create a movie clip and store a reference to it in a variable called nav. We place all our boxes within this clip starting on lines 13-18. It's important to note that we've set the Box movie clip in our library to export for ActionScript.
The real trick is the way we loop through and position all the boxes:
for (var i:int = 1; i < boxNum; i++) {
var b:MovieClip = MovieClip(nav.getChildAt(i));
var prev:MovieClip = MovieClip(nav.getChildAt(i-1));
b.x = prev.x + prev.width;
}
Within our for..loop we have references to the current clip b and the previous movie clip prev. We start the loop counter (i) at one so b is the second box and prev is the first box. The next time the loop runs b is the third box and prev is the second, and so on. The final result looks like this:
Download align_nav_2.fla (5.7 KB, 943 hits)
As an exercise you might consider building on this code to create an accordion widget.
Advanced Align Example
A more advanced version of this alignment allows the user to drag and drop the boxes. This technique could be used to create a myriad of different Flash widgets. I've used it to create functionality similar to photoshop layers and primitive timelines like the ones you see in video and audio editors.
Download advanced_algin.fla (7.8 KB, 1,676 hits)
This is what the code looks like:
-
var boxNum:int = 8;
-
-
var boxes:Array = new Array();
-
-
var container:MovieClip = new MovieClip();
-
container.x = 50;
-
container.y = 200;
-
addChild(container);
-
-
for (var i:int = 0; i <boxNum; i++) {
-
var b:MovieClip = new Box();
-
b.x = 50 + b.width * i;
-
b.originalIndex.text = i;
-
setupDraggableBox(b);
-
container.addChild(b);
-
}
-
-
function setupDraggableBox(mc:MovieClip):void {
-
// local variable for use with zeno's paradox
-
mc.xDest = mc.x;
-
// randomize the width to illustrate flexibility
-
mc.bg.width = int(Math.random() * 30) + 30;
-
mc.buttonMode = true;
-
mc.mouseChildren = false;
-
mc.addEventListener(MouseEvent.MOUSE_DOWN, onDown, false, 0, true);
-
boxes.push(mc);
-
}
-
-
function onDown(evt:MouseEvent):void {
-
removeEventListener(Event.ENTER_FRAME, onLoop);
-
container.addChild(MovieClip(evt.currentTarget));
-
evt.currentTarget.startDrag();
-
}
-
-
stage.addEventListener(MouseEvent.MOUSE_UP, onStageUp, false, 0, true);
-
-
function onStageUp(evt:MouseEvent):void {
-
stopDrag();
-
addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);
-
}
-
-
addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);
-
-
function onLoop(evt:Event):void {
-
// sort the boxes array by the x property
-
// of each clip
-
boxes.sortOn("x", Array.NUMERIC);
-
-
// make sure the first box always eases to
-
// the same position (50, 200);
-
boxes[0].x += (0 - boxes[0].x) / 2;
-
boxes[0].y += (0 - boxes[0].y) / 2
-
boxes[0].currentIndex.text = 0;
-
-
// align boxes
-
for (var i:int = 1; i <boxNum; i++) {
-
var b:MovieClip = boxes[i];
-
var prev:MovieClip = boxes[i - 1];
-
b.currentIndex.text = i;
-
b.xDest = prev.x + prev.width;
-
b.x += (b.xDest - b.x) / 2;
-
b.y += (0 - b.y) / 2;
-
}
-
}
The basic structure of this code is similar to the prevous examples with a few important differences. All the boxes are stored in an array. On line 47 we call the Array.sortOn() method which sorts the boxes array according to the x position of each box. So the box with the lowest x position will become boxes[0]. Once the array is sorted we're able to run our align code (lines 56-63), which works almost exactly the same as it did in the previous examples. The only difference is that we set the local variable xDest that exists within each box instead of directly setting each box's x property. xDest is then used in conjunction with Zeno's paradox.
Print This Post
Nice werk. I look forward to playing with this.
Thanks
That was inspiring. Help me to think in a more creative way
Thanks Alan and Keith. Glad to hear that it helped you to think about programming in a creative way.
There's lots of fun to be had with the techniques mentioned in this post.
keep on the good work... 2 thumbs up!
Beautiful job.
Thank!! It's Good job!
Question: Why is the variable scaleDest declared simply
mc.scaleDest = 1;
Why in this case is var scaleDest:Number = 1; not used?
@thon, good question. If you're referring to line 10 of the first script, it's because mc isn't a variable. It's an argument so it is valid while inside the function and does not require a declaration. It's easy to miss, but if you need a brush up on this, take a look at Chapter 2 in the book in the section called Functions. Good luck!
Thanks for this very interesting learned alot.
I was woundering is it possible to place a movie clip inside the box once it has expanded?
Wow. Very interesting. to add onto Daz's comment. What about text. should be easy. I am going to give it a try.
This is a very useful tutorial. Thank you!
cool tutorial
Great Tutorial!!
I got a complier Error on Advanced Align Example:
line:31
1118:Implicit coercion of a value with static type Object to a possibly unrelated type flash.display:DisplayObject.
Source:Container.addChild(evt.currentTarget);
Your file download is work fine. But when I follow your tutorial and create a new practice I got this error eventhought I copy your whole scripts it still compiler error.
Any ideas ?
thanks,
ld
Lam Do.
Looks like you found a typo in the tutorial. Line 31 needs to be:
I changed it in the tutorial already. The reason for this is that the DisplayObjectContainer.addChild() method takes a DisplayObject like a MovieClip, Sprite, Video etc... as its argument. The currentTarget property of an Event is of type Object, so you need to cast it to some kind of DisplayObject before passing it to addChild()
Thanks, the problem solved.
I created the MC Box and MC bg but I didn't the give a name for MC bg and it causes that error.
ld
Perfect, exactly what I have been looking for.
How would I go about loading images in the Align Nav 2?
Many thanks!
Gayle
To back up the look I am trying to achieve please view the gallery in the following Interior Design website in projects button.
www.kirillistomin.com
Look forward to hearing from you!
Gayle
@Gayle, we have a post for an image gallery that may help get you started. Check out: Grids: Image Gallery.
Hi Guys,
Very nice and usefull tutorial! But I got a question. I did exactly what it says in here. At first I got the same compiler error as Lam Do. I fixed it using Zevan's solution. But now it gives a copmlete new error:
"TypeError: Error #1010: A term is undefined and has no properties.
at Untitled_fla::MainTimeline/setupDraggableBox()
at Untitled_fla::MainTimeline/frame1()"
Even when I copy paste the code in this tutorial.. It just won't work..
Is there something I'm doing wrong????
Hejj!
I figured it out!! For those who want to know....
I only gave bg movieclip an instance name once. I only did it on the main stage. I thought it would keep the same instance name when you insert the movieclip within the Box movieclip. But it didn't. You have to do that twice
(at least I had to).. So sorry... my bad.. I thought a movieclip always keeps his instance name when you give it one. Sorry guys...
How would this work for multiple groups? In the onLoop function, the MovieClips always go to the same position (I also don't understand how this works because the code:
boxes[0].x = (0 - boxes[0].x) / 2;
boxes[0].y = (0 - boxes[0].y) / 2;.
always sets the (x,y) to (0,0) of the parent container.
I have been racking my brain trying to figure this out, but to no avail. I was able to create 3 separate arrays and have them sort, but they all still go to a global (0,0). Any suggestions?
@KS I'm not entirely sure I understand your problem... but I have a few suggestions about how to have multiple groups. If you have three different arrays working, use three different parent containers and move the parent containers themselves. That way you can just leave the first box in the array at (0,0) but move the container anywhere on the stage.
Alternatively you could try and wrap the code into a class that extends Sprite or MovieClip. You could then make instances of the class and position each one in a different place.
Zevan, thanks for your speedy reply! I totally understand what you're saying about having 3 containers. That part I have already done. The problem is the client requested that we not use classes, so now I'm staring at 700 lines of code in an .fla file.
Here's a quick breakdown:
• Drag and drop (19 drags, 3 drop areas)
• Once all the drags have been dropped onto the 3 drop areas, a button click is supposed to line up the dropped terms neatly into columns, adding each set of drags to one of 3 empty MovieClips using addChild (just like in the example).
• The user needs to be able to rearrange the drags between the 3 columns or the column each one is currently in.
•If the drag is dropped over a designated drop area, it is pushed to one of 3 arrays to keep track of which drag has been dropped where. That array's value is then set to currentColumnArray and is referenced in the onLoop function.
currentColumnArray = aColumnArray1; function onLoop(evt:Event):void { currentColumnArray.sortOn("y", Array.NUMERIC); currentColumnArray[0].x = (0 - currentColumnArray[0].x) / 2; currentColumnArray[0].y = (0 - currentColumnArray[0].y) / 2; for (var i:int = 1; i < currentColumnArray.length; i ) { var drag:MovieClip; var prevDrag:MovieClip; drag = currentColumnArray[i]; prevDrag = currentColumnArray[i-1]; drag.yDest = prevDrag.y prevDrag.height 11; drag.y = (term.yDest - drag .y) / 2; drag.x = (0 - drag .x) / 2; } }This is where I am stuck. The main problem for my project is that while each column of drags reorders within itself, all 3 lists of drags will all animate back to (0, 0) on the root stage, not to (0,0) in their respective parent containers.
If the code from the example
always results in 0, why not just make it 0 instead of calculating? I'm sure you have a good reason that I'm just not picking up on yet.
Thanks Zevan!
For the align example using the scaleX property, how would you add an image to each box and still be able to scale each boxes x property without distorting the image? Can't figure this one out...can anyone lead me in the right direction?
@KS: Hey Kevin, thanks for the kind words about LAS3 on Twitter!
@thienedits, what would you like the box to do? You can't distort the width only and not distort the image. Any alternative would require an independent treatment of the image and container.
Do you want the image to scale proportionally? That might cause the image to scale out of view. Do you want the image not to scale?
Rich thanks for the reply. The image would not scale. It would appear to be masked by the box, so when you rollover, the box scales revealing more of the image. Hope that makes sense
If i created one movieclip and arranged all my images horizontally inside it, would I be able to mask that movieclip with the box movieclips?
Here's an example http://www.bingham.com/Default.aspx
Masking is the way to go, but I'm not sure arranging the images horizontally is the way to go. I'd probably put all the images in, with an associated mask movie clip. Two things are going on in that example. The mask is scaled and the image is moved. By scaling the mask independently, you can move the image any way you like.
@Rich, no,no,no. Thank YOU guys for writing such an awesome book! I loved it even before Lee Brimelow's endorsement!
I am still struggling with modifying this code for my own project. I have tried several approaches, but to no avail. Really all I want to do is have 3 separate lists, being able to drag and drop an item from one list to another, and have them all not go to the Stage's 0,0 when onStageUp is called.
I even tried having the code running inside of 3 separate MovieClips, which ended in memory issues and causing the Flash CS4 IDE "Test Movie" Player to produce a different output than the Debug and Standalone Players (see the Flash Forums. Ridiculous to even try, I know, but I'm missing something somewhere. Any ideas?
Thanks Rich!
And apparently this comment is from the future [I'm on (GMT-5:00) Eastern Time (US & Canada)]
Partial success!
function onDown(evt:MouseEvent):void { removeEventListener(Event.ENTER_FRAME, onLoop); var currentTerm:MovieClip = MovieClip(evt.currentTarget); currentTerm.parent.addChild(currentTerm); currentTerm.startDrag(); }This seems to fix it as far as the sorting and returning to its parent container's 0,0 goes. I still don't know why the code just doesn't say 0, 0 instead of:
Can you explain this?
Also, I am using a TimerEvent.TIMER to prevent the EnterFrame Event from constantly running. It's just a 5 second buffer that removes the listener from the stage after onLoop finishes, but it seems to help. Now I just have to work on transferring from one group to another. Any insight? Thanks!
Can I jump in here? I am a film teacher looking to make a flash module on basic film editing. The example above is perfect! and I have been looking for a very long time for something like this but I need the Advanced Align Example (above)to have graphics in them or even better video clips! thisw ould allow students to drag different clips to different areas in a "time line."
I have seen this once but the site is now gone. The user was able to drag short video clips in any order and then play the order of the clips to view the entire. There is a site I found that sort of does this but it uses icons to drag into a grid and then the various clips play in an order determined by what icons the user drags into the grid.
http://portfolio.barbariangroup.com/portfoliojobs/259/index.html
and then select ‘Interactive films.” the scene order of the movie that plays depends on what icons are placed on the grid.
All I really need though is at least the above advance alignment fla to allow for graphics (no resizing or anything needed just the ability to drag and drop to rearrange the order, thanks!
Hi mate i just found your site about moving objects/sortable lists.
i run a family/friends fantsy football comp and for years have played with different ways for the player to log in and select a playing team from their available squad and have it emailed to me as a form.
basically my question is can your script be used for someone to rearrange the order then have a submit button so the order chosen could be emailed to me??
i have plently of other info and questions but i suppose it all comes down to whether that main questin is able to be done or if its too hard for the average joe.
@Ashley, you can certainly use the script to reposition things, but there's no email functionality built in. There are scores and scores of email scripts online, and most require some interaction with the server, such as PHP. You'll need to talk to your system administrator to see what scripting environments are supported on your server and then find one that fits your needs.
Hi, I have created accordion using your code. I have three buttons(movieclips) on stage and inside each movieclip is a mask that masks submenus. So when you roll over the button , the mask expands revealing submenus - buttons(movie clips). All buttons are aligning to the mask. So far so good. But there is a problem. I can not access submenus - nested movie clips which are revealed by the expanding mask. Any ideas??? I guess it must me something to do with those "setupRollOvers"....... hmmmm... I have created three different "setupRollOvers" because each expanding box needs to be different height. Thank you in advance.
here is the code:
// alignment code box1.buttonMode =box2.buttonMode =box3.buttonMode = true; box1.x = 54; box1.y = 47; setupRollOver1(box1.mask1); setupRollOver2(box2.mask2); setupRollOver3(box3.mask3); function setupRollOver1(mc:MovieClip):void { // add a local variable to each clip for use with Zeno's paradox mc.scaleDest1 = 1; mc.buttonMode = true; mc.addEventListener(MouseEvent.ROLL_OVER, onOver1, false, 0, true); mc.addEventListener(MouseEvent.ROLL_OUT, onOut1, false, 0, true); mc.addEventListener(Event.ENTER_FRAME, onScale1, false, 0, true); } function onScale1(evt:Event):void { var mc:MovieClip = MovieClip(evt.target); mc.scaleY = (mc.scaleDest1 - mc.scaleY) / 3.5; } function onOver1(evt:MouseEvent):void { evt.target.scaleDest1 = 3; } function onOut1(evt:MouseEvent):void { evt.target.scaleDest1 = 1; } //------------------------------------------------------------------------------------------- function setupRollOver2(mc:MovieClip):void { // add a local variable to each clip for use with Zeno's paradox mc.scaleDest2 = 1; mc.buttonMode = true; mc.addEventListener(MouseEvent.ROLL_OVER, onOver2, false, 0, true); mc.addEventListener(MouseEvent.ROLL_OUT, onOut2, false, 0, true); mc.addEventListener(Event.ENTER_FRAME, onScale2, false, 0, true); } function onScale2(evt:Event):void { var mc:MovieClip = MovieClip(evt.target); mc.scaleY = (mc.scaleDest2 - mc.scaleY) / 3.5; } function onOver2(evt:MouseEvent):void { evt.target.scaleDest2 = 6; } function onOut2(evt:MouseEvent):void { evt.target.scaleDest2 = 1; } //------------------------------------------------------------------------------------------- function setupRollOver3(mc:MovieClip):void { // add a local variable to each clip for use with Zeno's paradox mc.scaleDest3 = 1; mc.buttonMode = true; mc.addEventListener(MouseEvent.ROLL_OVER, onOver3, false, 0, true); mc.addEventListener(MouseEvent.ROLL_OUT, onOut3, false, 0, true); mc.addEventListener(Event.ENTER_FRAME, onScale3, false, 0, true); } function onScale3(evt:Event):void { var mc:MovieClip = MovieClip(evt.target); mc.scaleY = (mc.scaleDest3 - mc.scaleY) / 3.5; } function onOver3(evt:MouseEvent):void { evt.target.scaleDest3 = 6; } function onOut3(evt:MouseEvent):void { evt.target.scaleDest3 = 1; } addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true); function onLoop(evt:Event):void { // position box1 based on box0's x and width properties box2.y = (box1.y box1.mask1.height); box2.x = box1.x; box3.y = (box2.y box2.mask2.height); box3.x = box2.x; } //---------------- no errors but it doesn't work
----------------------
box1.subMenu.addEventListener(MouseEvent.MOUSE_UP, menuUp);
function menuUp(e:MouseEvent):void{
trace("It is not enough room to swing a cat");
}
I think it is because the the mask is listening to some eventHandlers and it is covering the buttons. so the event handlers of the button do not get through..... could it be the case? If so how can I get through to my buttons?
thank you
Hi I found this a couple of days ago and this is very helpfully however I am stuck with something I'm trying to have the the boxes width change depending on a dynamic text filed, but I'm getting space which I believe is caused by the container moveclip. I was hopping you could help me with this here is the code thanks, almog.
public function init(searchwords:Array):void { trace("MainViewBasic init"); var i:int; var j:int; container.x = 10; container.y = 40; //For each searchword for each (var word:String in searchwords) { //How many search words there are NUM_SEARCHWORDS ; //Adds the search word var searchWordBox:SearchWordBox = new SearchWordBox(); var searchWordTxt:TextField = new TextField; //Adds the text searchWordTxt.text = word; ( i); //Sets the text format searchWordTxt.setTextFormat( searchWordBox.searchWordTextFormat ); //Adds searchWordTxt to search word box, this is the text searchWordBox.addChild(searchWordTxt); //Adds searchWordBox to container container.addChild(searchWordBox); //Adds container to powerWordsBoxContainer - powerWordsBox powerWordsBoxContainer.powerWordsBox.addChild(container); //trace(searchWordTxt.textWidth); //powerWordsBoxContainer.powerWordsBox.searchWordBox.width = 50; trace(container.width); _searchWords.push(searchWordBox); //searchWordContainer.name = "searchWordContainer" i; searchWordBox.addEventListener(MouseEvent.MOUSE_UP, onStageUp, false, 0, true); setupDraggableBox(searchWordBox); } //Adds objects addChild(powerWordsBoxContainer); onStageUp(); } function setupDraggableBox(mc:SearchWordBox):void { // local variable for use with zeno's paradox mc.xDest = mc.x; mc.buttonMode = true; mc.mouseChildren = false; mc.addEventListener(MouseEvent.MOUSE_DOWN, onDown, false, 0, true); //_searchWords.push(mc); } function onDown(evt:MouseEvent):void { removeEventListener(Event.ENTER_FRAME, onLoop); container.addChild(MovieClip(evt.currentTarget)); evt.currentTarget.startDrag(); } function onStageUp(evt:MouseEvent = null):void { stopDrag(); addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true); } function onLoop(evt:Event):void { //sort the boxes array by the x property of each clip _searchWords.sortOn("x", Array.NUMERIC); //make sure the first box always eases to the same position (10, 40); _searchWords[0].x = (0 - _searchWords[0].x) / 2; _searchWords[0].y = (0 - _searchWords[0].y) / 2; //align boxes for (var i:int = 1; i <NUM_SEARCHWORDS; i ) { var b:MovieClip=_searchWords[i]; var prev:MovieClip=_searchWords[i-1]; b.xDest=prev.x prev.width; b.x = (b.xDest - b.x) / 2; b.y = (0 - b.y) / 2; } }I was also trying to get two columns set up and not just a line.
I did this which sets it up but now when I move an object it gets all messed up
could really use the help. Thanks.
Nice examples, I was wondering, how could I apply this to a grid and when a user clicks on a cell, the rest of the cells move away from the one clicked based on the proximity to the cell clicked. ie, cells closer to the cell clicked move away farther than cells farther away from the cell clicked. If anyone has a link explaining something similar to that, I would appreciate it.