在flex中，使用VBox堆叠组件时如何获取坐标？

Question

在flex中，我正在使用VBox和HBox来堆叠组件。当我尝试获取组件的x，y坐标时，我总是得到0。如果我像mx：VBox x =“ 120”这样指定坐标，那么我会得到值。

如何在没有明确说明的情况下获得坐标。

Answer 1

您可以相对于舞台平移坐标。请查看下面的代码：

var box:VBox = new VBox;
var child:DisplayObject = new DisplayObject;

box.addChild(child);

child.addEventListener(FlexEvent.UPDATE_COMPLETE, updateCompleteHandler);

...

private function updateCompleteHandler(fe:FlexEvent):void{
  // find global coordinates
  var globalCoords:Point = child.localToGlobal(new Point(0,0));

  // coordsInBox is what you are looking for
  var coordsInBox:Point = box.globalToLocal(globalCoords); 
}

重点是使用localToGlobal作为子组件，然后使用globalToLocal转换全局坐标，以便相对于Box容器表达它们。

[请注意，在子对象调用UPDATE_COMPLETE之前，不会处理坐标。

Answer 2

组件的X和Y值始终相对于组件的父级。 directionsHelp.x和directionsHelp.y都将返回相对于包含它们的VBox的位置，除非您明确设置值或在其周围插入其他组件，否则默认情况下将为0。

关于localToGlobal()的要记住的是，您必须从孩子那里调用它。如果您有一个Application而只是调用localToGlobal( new Point(child.x, child.y) )，它将尝试返回Application中相对于该阶段的给定点（因为您尚未指定“本地”是什么），因此将不进行任何转换，因此它将保持等于（0，0）。

但是如果您调用child.localToGlobal( new Point(child.x, child.y) )，它将返回孩子相对于舞台的位置的值，将给定的点变换孩子在舞台上的偏移量为多少。

这是一个演示的快速应用程序：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"    backgroundColor="#FFFFFF">
    <mx:Script>
        <![CDATA[
            private function updateCoords():void
            {
                var point:Point = new Point(directionsHelp.x, directionsHelp.y);
                point = directionsHelp.localToGlobal(point);
                directionsHelp.text = "My stage coordinates are ("+point.x+", "+point.y+")";
            }
        ]]>
    </mx:Script>
    <mx:VBox>
        <mx:Box height="100" width="100" borderStyle="solid" borderColor="#000000"
            horizontalAlign="center" verticalAlign="middle">
            <mx:Label text="100 x 100" />
        </mx:Box>
        <mx:VBox>
            <mx:Text id="directionsHelp" color="#4FA4CD" fontSize="8" fontWeight="bold"
                text="Click the button to display my position on the stage." />
            <mx:Button label="Get Position" click="updateCoords()" />
        </mx:VBox>
    </mx:VBox>
</mx:Application>