Home > Flash development > Pan, Zoom and Gtween

Pan, Zoom and Gtween

Recently I had a Flash problem to solve where the content needed to pan and zoom in one smooth motion to the point where a user clicked. The technique was a little tougher to figure out than I originally thought but I got it down to essentially three lines (using Grant Skinner's gTween).

The source FLA is available here. Below is a code snippet that assumes you are panning to center and zoom to 400%:

Actionscript:
  1. var xStop:Number = base.x  + ((stage.stageWidth/2)*4 - (mouseX*4));
  2. var yStop:Number = base.y  + ((stage.stageHeight/2)*4 - (mouseY*4));
  3. var gTween:GTween = new GTween(base,.5,{y:yStop, x:xStop, scaleX:4, scaleY:4},{ease:Circular.easeOut});

Example: click on the blue circles to zoom in and anywhere around the circles to zoom out.


Categories: Flash development Tags:
  1. No comments yet.
  1. No trackbacks yet.