Click to zoom in

[Juggleballz]

Yo code heads, how are you.

I have a pondering question needing answered.

Here goes:

Say I have a large rectangle with its rotation being in the dead centre. If I want to click on this rectangle to make it scale up (pseudo zooming in) i just tell it to scale to a certain size. Easy peasy.

Now if I want it to move to a specific coordinate it will, so if i want a 1000x1000 rectangle to scale up to twice the size, and move to a particular coordinate, i simply use ._xscale ._yscale, ._x and ._y. That is simple enough.

The problem with moving an object to a particular coordinate makes the rectangle center itself around that coordinate. So if i click in the top left hand corner of the rectangle because I want to zoom into that part of the rectangle, i can't really, becuase the whole rectangle shifts its position until it's center point is at that coordinate, and the top left hand corner moves off the stage so it doesnt zoom into that area.

My question is this:

If I have a large rectangular picture and I want to be able to zoom into any part or it and nake it shift the image so that this particular section is in the center of the stage, how do I do so?

I am finding it hard to explain but I'm feeling rather stupid today. If you want I will make a diagram to show you what I mean.

Cheers me dears!

[Jaehl]

I imagine you want something like this:

Code:

rectangle.onPress = function() {
rectangle._x = HALF_STAGE_WIDTH-rectangle._xmouse*2; //The "*2" on the end is the scale factor (x2)
rectangle._y = HALF_STAGE_HEIGHT-rectangle._ymouse*2; //Replace HALF_STAGE_WIDTH and HALF_STAGE_HEIGHT with their respective values
rectangle._xscale = 200;
rectangle._yscale = 200;
}

[Juggleballz]

That works really well, thank you Jaehl! Awesome. I'm a little retarded, could you explain the code... 

One more thing, is it possible to animate it's scaling. Like when I click it it zooms in with inertia / easing?
If it is too much hasslem don't worry about it, its no biggy.
Thanks bro!

[Cel]

Here you go. I assume you're using AS2.

Code:

var ZOOM_SPEED = 20;// The lower the faster
var NORM_ZOOM = 100;
var LARGE_ZOOM = 200;
var Lock:Boolean = false;

rect.onPress = function() {
if (!Lock) {
if (rect._xscale == 100) {
ZoomAnim(rect,LARGE_ZOOM);
} else {
ZoomAnim(rect,NORM_ZOOM);
}
}
};

function ZoomAnim(obj:MovieClip, target:Number) {
Lock = true;
var Diff = Math.abs(target - obj._xscale);
if (Diff <= 1) {
obj._xscale = target;
obj._yscale = target;
Lock = false;
} else {
var Accel = 3;// The lower, the slower it will "ease"
if (target < obj._xscale) {
Accel *= -1;
}
obj._xscale += Diff / ZOOM_SPEED * Accel;
obj._yscale += Diff / ZOOM_SPEED * Accel;
setTimeout(ZoomAnim,10,obj,target);
}
}