Actionscript 3 :: Flash - Center An Object Around A Point After Scale?
Oct 27, 2011
I've created an mc which functions as my map and controls to go with that which allow the map to be moved around and key points navigated to and zoomed in on at varying zoom levels.I'm using scaleX and scaleY to scale the map mc and a list of x and y positions to correctly position the map for each key point.When I want to go to a certain area I perform this calculation (offsetX and offsetY are the center of the screen):
Then I tween the position and scale of the map to smoothly scale and move the map to the correct position:
var tween = new TweenLite(_background, EASING_SPEED, {x:newX, y:newY,scaleX:scale.getScale(),scaleY:scale,ease:EASING_TYPE,onComplete:moveToComplete,onCompleteParams:[room]});
I now need to implement a zoom in / out function and this is what I'm struggling with. The zoom should use the center of the screen as the reg point for the scale, so I've been trying something along the lines of the following to get the correct positioning:
var newX = offsetX - (offsetX - _background.x) * scale;
var newY = offsetY - (offsetY - _background.y) * scale;
So in my mind this gets the distance from the current position of the map relative to the center point of the screen (offsetX, offsetY) then scales that distance by the new scale. However, this is clearly wrong because it's not working and the positioning of the map is wrong.I've also tried using a transform matrix to get the correct values but I know even less about them and not got the right results.
function scale(target:MovieClip, center:Point, scale:Number):Point {
var m:Matrix = new Matrix();
m.translate(-center.x, -center.y);//move the center into (0,0)
1. Is there a way to scale up an object from its center even if its registeration point is at the top left? can that be done using TweenMax?2. can I apply the same tween on two objects at the same time? basically what I want to do is load up an image to the stage, and then tween its scale from 0 to the original size along with another movie clip behind it that would form some sort of a border for the image. and I want to scale them up from the center.
I'm trying to make a text effect where on every frame the textfield increases in size and decreases in opacity. I'm using the scaleX and scaleY properties of my dynamic textfield to enlarge, but it's doing so keeping the left registration point fixed. I want to make it scale up radially outward, or with the center point fixed.
basically just wondering if its possible to scale an MC about the center of the stage as opposed to the top left of the MC? I thought about setting the X & Y as stage width / 2 + MC width / 2 but cant as the user needs to be able to move the MC which is much bigger than the stage and zoom in on a point in the center rather than just the center of the MC.
I'm trying to add some zooming functionality. The problem is that when you zoom in and out, it scales the MC up and down from where the registration point is. This means That when I'm far from the position of the registration point instead of zooming the in straight it also makes it appear as if you are travelling towards the registration point.
To offset this effect I want to calculate the amount of pixels I need to offset the Map by so that it appears as if you are zooming in directly.
So just as a test I've put a little ball inside the map(called "center") which I'm trying to keep in the center of the map.[code]...
When you create shape on stage and right click and chose create object you can chose Registration point for the object..you chose what corner will be used as center of coordinates for this object. Now onice you create object is there way to change this registration point e.g. i created it in center now i want to to be in upper left corner?
I have had some help but still not understanding this.
How can I scale an object from center after it is dragged by the user?
Currently I have this: function onSliderChange(e:SliderEvent):void { scaleClip(slider.value); }
[Code]...
With this code the movieclip jumps back to the center of the stage each time I call the scaleClip() (move the slider). I would like the object to scale from it's own center regardless of where it is on the stage.
I have developed a flash app in AS3 that allows you to drag objects around on stage, save,and load them. When the "save" button is pressed, it then loops through each item on the stage and gets the coordinates (x and y) for the bottom left corner and the top right corner. Code:
Code: ActionScript Code: var bottomLeft:Point = new Point(-50, -50);
When you load a object through flash, you can set the rotational/scale point, but when you load it as a loader object or sprite, how do you change this point?
In this instance, I want to change the height of a sprite that is filled with a rectangle so that it shrinks down, not up.
Right now:
var colored_bar:Sprite = new Sprite(); with (colored_bar.graphics) { beginFill(0x9e1819, 1);
[Code]....
The way I am doing it currently is moving the y position everytime I take away soem of the height, so it looks like it's moving down, but I'd think moving the orientation point at the beginning would be faster
When you create shape on stage and right click and chose create object you can chose Registration point for the object you chose what corner will be used as center of coordinates for this object. Now onice you create object is there way to change this registration point e.g. i created it in center now i want to to be in upper left corner?
When you create shape on stage and right click and chose create object you can chose Registration point for the object
you chose what corner will be used as center of coordinates for this object. Now onice you create object is there way to change this registration point e.g. i created it in center now i want to to be in upper left corner?
I am using AS2 and I'm looking for a way to scale an MC from the center meaning that the width will expand equally on both sides.For example .. If the movie clips needs to expand +10 then it would be +5 on the left and +5 on the right.So, in order to simulate the movie clip going forward the position on the left would offset -5 then scale.
I'm trying to figure out how to find a point relative to the center of an object, modified by its rotation. For example, in the attached swf, I've been messing around trying to draw trails to a bitmap, coming out of the thrusters. I didn't have a problem at first, but as the ship rotated, the lines that were being drawn wouldn't remain relative.
http:[url]....
I'm sure this is because I have no idea what I'm doing, and I've just been sort of idioting my way through it. That aside, is there an easy way to find the point I'm looking for? For instance, say I want a point at Y -14 of my ship, but I want that to remain relative to the ship as it rotates.
Using the new 3D features in CS4. I know you can change the 3d center point manually via the Transform panel, but does anyone know how to do this dynamically at runtime? (ie via code)
I'm trying to see if there's a way to change the registration point of a MovieClip that's importing an image dynamically?Here is my code where I add an image to an "overlayHolder":
What I need to do is rotate this image later on, upon interaction from someone, but need it to rotate with a center-registration.I've seen a bunch of tutorials/forums talk about centering a registration point when you're drawing a Sprite on the stage, but not when you're importing an image.
I have a MC in an AS3 animation and I want to increase its height from bottom to top which would mean that the registration point should be bottom of the MC and center of width (horizontal center).
I need to build a flash learn game to my students. It is to explain the angles and phisics over the billiard/snooker Table. Something similar to this: [URL] The only thing I can do until now is drag the ball! My doubts are:
- How to make the stick move with the center in the point near the ball; - How to draw the yellow line; - How to calculate the corners; - And in the last, how to move the ball with accelerated motion when press a button.
I have created a movieclip with programming and added a image via xml loader. I am scaling it down using tweenlite. But it scales as if the registration point is on the top left of the image. Do you know how to change it so it scales from the center?
Each time the square is clicked it scales up a little. What must be added or changed to prevent it from moving off center from its original position, and to have it scale evenly in all directions from its own center?
i have a simple rectangle. i would like to scale it to 200 but the scaling always begins from top-left corner of the rectangle. how can i scale it from the center?
when i edit an objects z value in flash, the "scaling" is not centered, i want to emulate the same effect as center scaling x and y but using Z, how fo i do this?
I have an image inside a movie clip that a user can scale from its center using the slider....works great.However the use can also drag the movie clip.After the movie clip is dragged to a new location it and then scaled using the slider it jumps back to the center of the stage and then scales.I have tried modifying the x y of the movie clip but then the scale is no longer from the movie clip's center.
var clipNativeX = holder_mc.x; var clipNativeY = holder_mc.y; function scaleClip(val:int):void[code]......
how I could setup an Image so when it loads, and I change its Z value, it doesnt keep shifting in reference to the upper left. Right now, when I change the Z value of a Sprite containing the Image, it appears to move x, y (even though I know they are not changing). I thought that by putting it inside of a sprite, and then moving the image to so that its center was at 0,0 inside the sprite, that when I changed the z value of the sprite and not of the bitmap itself, it would fix my problem, but its not.
bmp = new Sprite(); var bmp1:Bitmap; loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, fileLoaded);
I have a list of artist, each one a mc, in a vertical display. Next to them, I have a holder in which I load the thumbnails one the mouse is over a mc.This images, are being loaded via loadclip.. resize-center and then shown with alpha..But sometimes, the image are shown huge, and instantly resized and positioned.This a dvd project.. so images are not being downloaded..this is the part of the code..
I am using a slider component to scale a movie clip. Currently it scales from the bottom right corner (I guess this is default). I would like the MC to scale out from the center.
I've recently taken Krilnon's tutorial on interactive image panning, and have a need for more complexity. My image to be panned (relative to user's mouse movement) has several 'hot spot' buttons placed within. Each hot spot, when clicked, is to smoothly zoom and shift within the mask, with pertinent info displayed next to each, once zoom and shift is complete. almost like I'm making a motion tween, where the final position is known, but the start position is wherever the BG image is when the user clicks the nested button. I need to determine the x-position at the moment of click of the button (different for each button), and then, I think, use a simple-math "stagger-step" method of moving and scaling, until I've reached my final dest. here's the link to the tutorial I originally referenced:If anyone knows of a tutorial or example out there, I'd love directions to it(them). or,
When you drag the screen in any direction the background scales and rezises.But How do I make the text stay center and a certain size so that it wont scale to fit the screen and will stay a certain size
I have a dynamic image loading into a movie clip and i dynamically created a transform box around it. However the anchor point of that transform box is coming on the left top instead of in the center, which is not letting the image transform properly. how to dynamically put the anchor point to center through AS2?