positioning a movieclip relative to another movieclip - actionscript-3

I have two movie clips on the stage and what I'm trying to do is position the second mc relative to the left of the other (the first one's width is 24px, while the second one is 151px)
I thought the way to do this was by giving the second mc the x of the first then subtracting the width from the second mc x, but it doesn't seem to be working. how does as3 calculate x positioning of an mc? is it from the center of the mc out or is it using the origin point somehow?

When you create a movie clip there is a registration point created in the process which is where all transformations of this type are referenced from.
If you are creating the movie clip in the Flash environment rather than code you can select which position to create this point when you are creating the movie clip. There is a square grid which allows you to choose this. I usually like to use the top left so when you do:
moveclipA.x = movieclipB.x - movieclipA.width
then you will get it positioned exactly next to the left movieclipB.
How are your movieclips positioned? Are they layered on top of each other? If so I suspsect that your registration point is at the centre. To solve this you can multiply the distance it is moving to the left by 2

Related

Make stage draggable, but keep a specific shape always in the same relative position (KineticJS)

does anybody know, how to drag the stage "behind" a certain shape or shape-group, so the shape doesn't get dragged around with all the other items on the stage and of course, the stage itself?
In my example I have a stage with many items outside of the visible part of the<canvas>-tag which can only be reached by dragging the stage to the left/right, but one of the shapes should be always on position (0, 0) of the <canvas>-element and shouldn't change its position while the stage is dragged.
I couldn't find a way to do this yet, so I would be very glad if anyone knows a way to get this working.
If the one shape left at (0,0) of the canvas is always the same shape and never changes, you can add all other elements to a group excluding the shape that is positioned at (0,0) and drag the group instead of dragging the stage.
If you must drag the stage, then you'll have to calculate the distance of x that the mouse has moved while dragging, and apply that to the position of the shape at (0,0).

Setting movieclip origin with AS3

I have a spotlight that moves on a stage.
Now I rotate the spotlight but its not rotating on the correct point/origin.
I am trying to do something like
myOject.setOrigin = {x , y};
//and then rotate it about x,y.
I have manually set the white circle in the correct place and when I rotate the
object with the mouse on the screen it works.
Can somebody help me?
Make sure the registration point is in the middle of your symbol. It's not the white circle that appears when you use the Free Transform Tool:
But the crosshair that appears when you edit your movie clip:
You can easily center the object by selecting everything, then opening the Align panel and aligning its horizontal and vertical axes to the center using the two "center" icons under the Align section. If your MC has multiple items per layer, group each layer before aligning, then ungroup after aligning:
The white circle is not what will be used as the origin, it's the little cross. Adjust your clip to have that in the center (you'll have to move all of it's contents). Another option, if moving is not possible, is to wrap your clip in another clip and move it within that.
Select symbol and click CTRL+E - Then move it to positioning cross.

scaling and positioning with tweenlite

I have a movieclip with the mesurements of a rectangle. When the application is launched the movieclip is being scaled before placed on the stage as following.
menu.width = 400;
menu.scaleY = menu.scaleX;
this is a smaller size than the original.
the position of the movieclip at this moment is in the middle on the x and top of the stage on the y.
when i click iti would like to do a tween with tweenlite wich scales it to its original(bigger) width and height and position it in the center of the stage on x and y.
the problem is when i position it with tweenlite, it gets done according to its old scale and not according to its new(bigger) scale so the movieclip isnt placed in the exact center of the stage.
Anyone know how i can resolve this?
I tried to compensate by adding a bigger number on the position so it gets positioned in the right way.
But when i click it again i would like it to rescale to its beginning scale and position so it would be very messy to compensate again. Is there any easier way to do this kind of tween?
I doubt that i'm being clear to what i want but i hope i am after all.
The easy and way of tween position and scale is probably to add the menu to a container.
You would then on one hand tween the position of the container, and on the other apply the scale to the menu it self without having to recalculate the proportional position if the scale changes.
This way you can even control the registration point of the menu within the container. e.g. to always scale from the middle...
This can be done with a matrix as well if you want to avoid to stack objects, but honestly it can get really tricky whereas the container method is bullet-proof.

Align the coordinate labels of the triangles, so that they never collide with each other. Actionscript 3

Im trying to achieve something similar to the flash movie in the below link.
http://mathopenref.com/coordtrianglearea.html
As we drag the points of the triangle, the coordinates labels, ( A(1,2)) are properly aligned and arrange themselves so that they never collide with each other and never falls inside the triangle.
Please guide me..
Thanks in advance.
in the example you gave, the textfield seems to be aligned outside the triangle on the angle bisection of the corresponding corner.
for the position in one corner, take the two vectors to the other corners. normalize them and then add them and normalize the resulting vector again. this gives you the vector v of the angle bisection in that corner. multiply the vector with a negative constant and add it to the corner, and you'll obtain a position p outside the triangle. finally, if the angle of v is between pi/2 and -pi/2 (pointing right) align the right border of the label to p, and the left border otherwise.
for simple vector calculations, please see flash.geom.Point.

How to prevent external translation of a movieclip object on stage in AS3?

I have a MovieClip object, which is exported for actionscript (AS3) in an .swc file.
When I place an instance of the clip on the stage without any modifications, it appears in the upper left corner, about half off stage (i.e. only the lower right quadrant of the object is visible). I understand that this is because the clip has a registration point which is not the upper left corner.
If you call getBounds() on the movieclip you can get the bounds of the clip (presumably from the "point" that it's aligned on) which looks something like (left: -303, top: -100, right: 303, bottom: 100), you can subtract the left and top values from the clip x and y:
clip.x -= bounds.left;
clip.y -= bounds.top;
This seems to properly align the clip fully on stage with the top left of the clip squarely in the corner of the stage.
But! Following that logic doesn't seem to work when aligning it on the center of the stage!
clip.x = (stage.stageWidth / 2);
etc...
This creates the crazy parallel universe where the clip is now down in the lower right corner of the stage.
The only clue I have is that looking at:
clip.transform.matrix
and
clip.transform.concatenatedMatrix
matrix has a tx value of 748 (half of stage height) ty value of 426 (Half of stage height)
concatenatedMatrix has a tx value of 1699.5 and ty value of 967.75
That's also obviously where the movieclip is getting positioned, but why? Where is this additional translation coming from?
I believe that I have solved the problem.
It seems that when the stage is not set to specific dimensions, the scale of the items (or this particular vector object in my case) on the stage is relative to some preset scale/dimensions (The origin of which I'm not sure -- with some testing it looks like it is affected by the ratio and dimensions of the stage).
Increasing the size of the stage increases that scaling value, which through some set of concatenations of matrices results in the movieclip getting scaled and translated at that same percentage (as the stage), even if you explicitly set the x/y/width/height values.
(Note: not just resizing dynamically. Resizing the window, closing and re-opening the window at that new size produces the same behavior)
I suspect this only happens with vector objects?
Anyway, the fix is to set the stage to an explicit width and height. Then the translation and scaling of the object appear to use an identity parent matrix, and everything works like you'd expect.