获取组件可见区域的全局坐标答案

【问题标题】：Getting the global coordinates of the visible area of a component获取组件可见区域的全局坐标
【发布时间】：2011-04-27 14:48:53
【问题描述】：

我正在尝试确定当前在舞台上呈现的可见矩形的全局坐标。

具体来说，如果画布具有明确的高度和宽度，并且是具有滚动条的面板的子项，则滚动条可以“隐藏”画布的一部分。 ContentToGlobal(x,y) 提供了当时内容的全局位置，但是内容坐标可以滚出父面板的边界，继续给出不可见的x,y坐标。

有没有办法确定不被任何东西隐藏的可视矩形？

【问题讨论】：

标签： apache-flex flex3

【解决方案1】：

事实证明，UIComponent 类有一个未记录的公共函数，它完全符合我的要求。

/**
 *  @private
 * 
 *  Get the bounds of this object that are visible to the user
 *  on the screen.
 * 
 *  @param targetParent The parent to stop at when calculating the visible
 *  bounds. If null, this object's system manager will be used as
 *  the parent.
 * 
 *  @return a <code>Rectangle</code> including the visible portion of the this 
 *  object. The rectangle is in global coordinates.
 */  
public function getVisibleRect(targetParent:DisplayObject = null):Rectangle

这是从类中提取的，并被记录为私有，但实际上是可在任何 UI 对象上使用的可公开访问的函数。

由于这不在任何地方的文档中，我想它可能会受到未来变化的影响。

【讨论】：

【解决方案2】：

不，没有直接的解决方案。

您应该手动计算可见矩形：

    private function getVisibleRectangle(container:Container, child:UIComponent):Rectangle
    {
        var rect:Rectangle = child.getBounds(child.stage);
        var containerMetrics:EdgeMetrics = container.viewMetrics;
        var containerPoint:Point = container.localToGlobal(new Point(0, 0));
        var containerRect:Rectangle = new Rectangle(containerPoint.x + containerMetrics.left, 
            containerPoint.y + containerMetrics.top, 
            container.width - containerMetrics.left - containerMetrics.right, 
            container.height - containerMetrics.top - containerMetrics.bottom);

        if (rect.left >= containerRect.right ||
            rect.right <= containerRect.left ||
            rect.top >= containerRect.bottom ||
            rect.bottom <= containerRect.top)
            return null;

        rect.left = Math.max(rect.left, containerRect.left);
        rect.right = Math.min(rect.right, containerRect.right);
        rect.top = Math.max(rect.top, containerRect.top);
        rect.bottom = Math.min(rect.bottom, containerRect.bottom);
        return rect;
    }

使用示例：

<mx:Panel id="panel" width="200" height="200">
    <mx:Canvas backgroundColor="green" width="100" height="100"/>
    <mx:Canvas id="canvas" backgroundColor="red" width="500" height="400" 
        enterFrame="trace(getVisibleRectangle(panel, canvas));"/>
</mx:Panel>

【讨论】：