为什么Flex的矩阵将捕捉的孩子转换回父级的上角？

| 我在Flex中遇到矩阵变换问题。我有一个Flex Canvas，里面只有一个图像，就像这样。

<mx:Canvas>
 <mx:Image id=\"img\" source=\"/some/Url\" />
</mx:Canvas>

我正在使用此代码将缩放/旋转转换应用于此图像，如下所示：

private function _rotateAndZoomImage(zoom:Number, angle:Number):void{
 var radians:Number = angle * (Math.PI / 180.0);
 var offsetWidth:Number = ( img.contentWidth/2.0 );
 var offsetHeight:Number = (  img.contentHeight/2.0 );
 var matrix:Matrix = new Matrix();

 matrix.translate(-offsetWidth, -offsetHeight);
 matrix.rotate(radians);
 //Do the zoom
 matrix.scale (zoom/100, zoom/100);
 matrix.translate(+offsetWidth, +offsetHeight);
 img.transform.matrix = matrix;
}

所有这一切。但。该图像是可拖动的。用户可以将其移动到作为其父级的画布内的任何位置。一旦移动了图像并应用了转换，图像在转换之前会被“捕捉”回到原始的0,0（画布的左上角）位置，然后留在该位置-而不是用户期望的位置成为。在一天的大部分时间里都在解决这个问题之后，我仍然无法弄清楚为什么它会这样做。有人吗编辑：请注意，在上述代码中没有两次调用.translate（）时，会发生相同的情况。因此，以下代码还将图像在移动后重新捕捉到画布的0,0：

private function _rotateAndZoomImage(zoom:Number, angle:Number):void{
 var radians:Number = angle * (Math.PI / 180.0);

 var matrix:Matrix = new Matrix();
 matrix.rotate(radians);
 matrix.scale (zoom/100, zoom/100);
 img.transform.matrix = matrix;
}

杰克

已邀请:

5 个回复

长拳

这是我固定的方法。我在我的Image类中覆盖了名为'super.move（）'的\'move \'函数，然后将转换矩阵重置为最初设置的值（在本例中为_affineTransform）。

    override public function move(x:Number, y:Number):void
    {
        super.move(x,y);
        this.transform.matrix = _affineTransform;
    }

哈克，但请注意...如果有人有更清洁的解决方案，请告诉我！

禽兢玫坞劲

如果您在mx.core.UIComponent中查找set x()替代的源代码，则会看到以下行：

 _layoutFeatures.layoutX = value

基本上，它将忽略默认显示列表“ 7”值，并将位置存储在其他位置。一旦处理完完整版式（替换您的翻译价值），实际的x可能会在以后设置。您可能应该始终使用x，y，scaleX，scaleY，rotation和任何其他相关属性。似乎Adobe并不打算让Flex支持常规的显示对象转换矩阵。

稼悸

我认为您可能必须将x，y值添加到翻译中：

private function _rotateAndZoomImage(zoom:Number, angle:Number):void{
 var radians:Number = angle * (Math.PI / 180.0);
 var offsetWidth:Number = ( img.contentWidth/2.0 );
 var offsetHeight:Number = (  img.contentHeight/2.0 );
 var matrix:Matrix = new Matrix();

 matrix.translate(-offsetWidth, -offsetHeight);
 matrix.rotate(radians);
 //Do the zoom
 matrix.scale (zoom/100, zoom/100);
 matrix.translate(img.x + offsetWidth, img.y + offsetHeight);
 img.transform.matrix = matrix;
}

催备南菠亨

尝试设置这个。

matrix.tx
matrix.ty

超可林

解决方案/解决方法很简单。代替这个：

<mx:Canvas>
 <mx:Image id=\"img\" source=\"/some/Url\" mouseDown=\"img.startDrag()\" />
</mx:Canvas>

我现在有这个：

<mx:Canvas>
 <mx:Canvas id=\"inner\" mouseDown=\"inner.startDrag()\" clipContent=\"false\">
  <mx:Image id=\"img\" source=\"/some/Url\" />
 </mx:Canvas>
</mx:Canvas>

可拖动的图像不再直接存在于主画布中。相反，它生活在儿童画布中。该图像本身不再是可拖动的。是内部画布被拖动。现在，将变换应用于图像后，它会保持原样，因为其父级的0,0坐标现在应该位于它们的位置，也就是您将画布拖动到的位置。希望这对某人有帮助，并节省了我在此上浪费的时间。杰克

要回复问题请先登录或注册

为什么Flex的矩阵将捕捉的孩子转换回父级的上角？

5 个回复

发起人

apache_flex

transform

matrix

问题状态

为什么Flex的矩阵将捕捉的孩子转换回父级的上角？

与内容相关的链接

5 个回复

发起人

apache_flex

transform

matrix

问题状态