Question

我正在尝试将DisplayObject缩放到某个点。我觉得这很容易，但我现在花了一天时间试图解决这个问题。

基本上，我认为应该工作。重视应该。

//newPoint is the point being centered. There is no initial scaling, so I do not need to compensate for that (yet)
//scale is the zoom level
//container is the parent of the obj
//obj is the object being scaled/panned
var p:Point = new Point(
    ( this.container.width - this.obj.width * scale + newPoint.x * scale ) / 2, 
    ( this.container.height - this.obj.height * scale + newPoint.y * scale ) / 2 
);

this.obj.scaleX = this.obj.scaleY = scale;
this.obj.x = p.x;
this.obj.y = p.y;

如果比例为1，它会使点居中，但随着比例的增加，它会越来越远离中心。我尝试过几十种不同的方法。我在几个网站上看到的This method产生了相同的结果。任何人都知道如何让这个工作？

编辑10-1-12 ：作为后续，我将LondonDrugs_MediaServices提供的code snippet作为我原始问题的基础。我需要能够以相对于未缩放图像的特定比例缩放到特定点（想想Google Maps如何缩放到特定位置）。要做到这一点，我必须在运行翻译代码之前将我的图像放在点上。我在下面发布了附加代码。对于其他用途（捏缩放，滚动和双击），我使用了Vesper提供的代码，效果非常好。

//obj is the object being translated
//container is its parent
//x and y are the coordinates to be zoomed to, in untranslated scaling
//obj.scaleX and obj.scaleY are always identical in my class, so there is no need to account for that


//calculates current center point, with scaling
var center:Point = new Point( ( this.container.width - this.obj.width * this.obj.scaleX ) / 2, ( this.container.height - this.obj.height * this.obj.scaleX ) / 2 );

//calulcates the distance from center the point is, with scaling
var distanceFromCenter:Point = new Point( this.obj.width * this.obj.scaleX / 2 - x * this.obj.scaleX, this.obj.height * this.obj.scaleX / 2 - y * this.obj.scaleX );

//center the object on that specific point
this.obj.x = center.x + distanceFromCenter.x;
this.obj.y = center.y + distanceFromCenter.y;

Answer 1

var mat:Matrix=new Matrix();
mat.translate(-p.x,-p.y);
mat.scale(desiredScale,desiredScale);
mat.translate(p.x,p.y);
yourObject.transform.matrix=mat;

核心观点是缩放是在（0,0）附近完成的，但你可以用描述仿射变换的矩阵来完成。您首先创建一个空矩阵（即，不进行变换的矩阵），然后对其应用一组变换。首先，将所需的点放在（0,0）处，翻译-1 *坐标，然后缩放，然后翻译回来。

Answer 2

别人...... 谢谢你的评论...... 我找到了答案...... 代码：

gambar.addEventListener（TransformGestureEvent.GESTURE_ZOOM，onZoom）;
function onZoom（event：TransformGestureEvent）：void {

    var locX:Number=event.localX;

    var locY:Number=event.localY;

    var stX:Number=event.stageX;

    var stY:Number=event.stageY;

    var prevScaleX:Number=gambar.scaleX;

    var prevScaleY:Number=gambar.scaleY;

    var mat:Matrix;

    var externalPoint=new Point(stX,stY);

    var internalPoint=new Point(locX,locY);

    gambar.scaleX *= event.scaleX;

    gambar.scaleY *= event.scaleY;

     if(event.scaleX>1 && gambar.scaleX>6){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }

     if(event.scaleY>1 && gambar.scaleY>6){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       } 

      if(event.scaleX<1 && gambar.scaleX<0.8){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }

     if(event.scaleY<1 && gambar.scaleY<0.8){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }  

     mat=gambar.transform.matrix.clone();

     MatrixTransformer.matchInternalPointWithExternal(mat,internalPoint,externalPoint);

     gambar.transform.matrix=mat;

    }

Answer 3

矩阵答案绝对正确，但如果您恰好是Club GreenSock会员，您可以使用TransformAroundPointPlugin

获得非常简单的代码。

http://www.greensock.com/as/docs/tween/com/greensock/plugins/TransformAroundPointPlugin.html

您可以在此处查看插件资源管理器中的示例： http://www.greensock.com/tweenlite/#plugins

我使用它来补充我的所有缩放比例并且比我手动尝试这样做时具有更好的性能。 IMO整个图书馆都值得用黄金来衡量（除了喜欢图书馆之外我没有任何联系）。如果您需要任何其他功能，我会调查它。它还有ThrowProps插件（http://www.greensock.com/throwprops/），如果你想要在移动设备上有一个你想要顺利返回界限的边界框，这是非常重要的。

Answer 4

将obj.x设置为-p.x，将obj.y设置为-p.y，将容器scaleX和scaleY设置为所需的值，并将p.x添加到容器x，将p.y添加到容器y。完成！

缩放到点和从点

4 个答案: