使用AS3放大和缩小

Question

you all know: "right click -> zoom in or out" in flash file, well, I need to do this but using, for example, clicking a button.

Is this possible using only AS3 code?

Thx!

Answer 1

你必须将所有图形放在一个精灵中，例如“场景”，然后修改它的比例......

Answer 2

Actually if you want to scale/zoomin/zoomout a stage or video object or anything else, multiply and divide should be used instead. Like this (this is what I used when I needed to create zoomin/zoomout functionality for web camera - digital zoom of course using scale functionality):

Assume that:

video_width = 640;
video_height = 480;

stage.scaleMode     = StageScaleMode.NO_SCALE; 
stage.align         = StageAlign.TOP_LEFT;
stage.stageWidth    = video_width;
stage.stageHeight   = video_height;


camera = Camera.getCamera();
// some other params

video = new Video( video_width, video_height );
video.attachCamera(camera);
addChild(video);

// to mirror webcam output:
video.scaleX = -1;
video.scaleY = 1;
video.x = video_width;
video.y = 0;


public function zoom(action:String = 'reset')
{
      var step = 1.1, // adjust this multiplyer for faster zoom. Eg. 1.2, 1.5, etc.
          x_offset = 0, 
          y_offset = 0;

    if (action == 'in')
    {
        video.scaleX *= step;
        video.scaleY *= step;

        x_offset = (stage.stageWidth - video.width)/2;
        y_offset = (stage.stageHeight - video.height)/2;
                // to center video object on stage by X if mirror effect is used
        video.x = stage.stageWidth - x_offset; 
                // to center video object on stage by X - no mirror
                // video.x = x_offset;
        video.y = y_offset; // to center video object on stage by Y
    }
    else if (action == 'out')
    {
            video.scaleX /= step;
        video.scaleY /= step;

        x_offset = (stage.stageWidth - video.width)/2;
        y_offset = (stage.stageHeight - video.height)/2;
        video.x = stage.stageWidth - x_offset;
        video.y = y_offset;
    }
    else
    {
                // need to be mirrored
        video.scaleX = -1; 
                // no mirror
                 // video.scaleX = 1;
        video.scaleY = 1;
                // if mirror video output
        video.x = stage.stageWidth;
               // no mirroring used
               // video.x = 0;
        video.y = 0;
    }       
}

Now you use this by attaching this functions to your buttons:

zoom('in');
zoom('out'); 
zoom('reset'); // reset zoom

Answer 3

Not as far as I know. Curious to see other answers though.

One hacky thing that comes to mind is, maybe you could use javascript to control a div containing your swf so that the div gets large(zoom in), but is displayed within the same 'scrollRect' rectangle. you would call the javascript function to do that using ExternalInterface.

A quick'n'dirty test I did using flash's scrollPane component:

//zoomIn,zoomOut = button
//sp = scrollPane, scrollDrag = true
zoomIn.addEventListener(MouseEvent.CLICK, zoom);
zoomOut.addEventListener(MouseEvent.CLICK, zoom);

function zoom(event:MouseEvent) {
    var scale:Number = event.currentTarget == zoomIn ? 1 : -1;
    sp.content.scaleX += scale;
    sp.content.scaleY += scale;
    sp.update();
}

Then I've noticed you are using flex, so surely there must be aa container that will allow you a similar functionality.

HTH, George

Answer 4

I would use scaleX and scaleY also, but simply with a number instead of George's solution with a var. So, something like

zoomInButton.addEventListener(MouseEvent.MOUSE_DOWN, zoomIn);
zoomOutButton.addEventListener(MouseEvent.MOUSE_DOWN, zoomOut);

function zoomIn(e:MouseEvent) {
  //actions for zoom-in function
  myPicture.scaleX += 10;
  myPicture.scaleY += 10;
}
function zoomOut(e:MouseEvent) {
  //actions for zoom-out function
  myPicture.scaleX += 10;
  myPicture.scaleY += 10;
}

You might stumble upon another obstacle though, which is that the picture gets scaled from and to the upper left corner. In that case try moving the picture with the scaling. Like

function zoomIn(e:MouseEvent) {
  //actions for zoom-in function
  myPicture.scaleX += 10;
  myPicture.scaleY += 10;
  myPicture.x -= 5;
  myPicture.y -= 5;
}