如何强制从孩子调整大小到父母答案

【问题标题】：How to force a resize from a child to a parent如何强制从孩子调整大小到父母
【发布时间】：2009-07-22 12:10:32
【问题描述】：

我有一个类似页面的 flex 应用程序。在我的主应用程序中，有一个显示所有页面的支架（画布）。问题在于，在主应用程序启动时，装载在支架内的组件比支架大。支架高度设置为 100%，但当我在他体内加载比他自己更大的组件时，他仍然会获得滚动条。

我该如何解决这个问题？如果它无法解决，如果我使用视图堆栈它会正常工作吗？

--更新--

持有人看起来像这样：

<mx:canvas height="100%">
</canvas>

但应用程序的末端低 500 像素，因此画布高度为 500 像素高。现在我在 1000 像素高的支架内放了一个新的孩子。现在支架高度应该是 1000 像素高

【问题讨论】：

标签： apache-flex actionscript canvas resize

【解决方案1】：

在将组件添加到主画布之前，检查子组件的大小以查看其是否大于父组件。如果是，那么您可以在对象上使用 scaleX 和 scaleY 将其缩小以适合您定义的区域。

您在问题中声明的是任何 flex 容器的默认行为...将较大的东西放入其中，您将获得滚动条。要消除滚动条，请使用：

horizontalScrollPolicy="off"
verticalScrollPolicy="off

编辑：

在 tabNavigator 或 viewStack 上使用“resizeToContent”...或者您可以将父容器的宽度绑定到当前子容器的宽度。

【讨论】：

也许我必须更好地解释一下：我有一个持有人。在应用程序开始时，持有人高度的 100% 意味着他的高度为 500 像素。现在我在 1000 像素高的支架内添加一个新的孩子。但支架仍然保持 500 像素高。但它应该是 1000 像素
gotcha... 将任何元素的高度设置为 100% 并不意味着它将调整为其子元素的大小...它会变为其父元素的 100%。您可以使用带有 resizeToContent="true" 的 TabNavigator
resizeToContent 在视图堆栈上也可用
我现在找到了另一个解决方案。首先，如果我向持有者添加了一个孩子，我将 childheight 设置为 100%。如果将其设置为 1000，则持有人将正确调整大小。糟糕的是，这不是动态的。我还是更喜欢动态解决方案
好吧，如果 viewstack 支持 resizeToContent 我想这是最干净的解决方案

【解决方案2】：

这是我正在玩的一些代码，用于自动调整大小的画布

//另存为AutoResizeCanvas.as

package
{
    import mx.containers.Canvas;
    import mx.core.Container;
    import mx.core.UIComponent;

    public class AutoResizeCanvas extends Canvas
    {
        public function AutoResizeCanvas()
        {
            super();
        }

        override protected function measure():void
        {
            super.measure();
            var nh:int = 0;
            var nw:int = 0;
            for( var n:int = 0; n< this.numChildren; n++)
            {
                var c:UIComponent = this.getChildAt( n) as UIComponent;
                if( c is Container)
                {
                    var cc:Container= c as Container;
                    nh += /*cc.viewMetricsAndPadding.top + */cc.viewMetricsAndPadding.bottom + c.height;
                    nw = Math.max( nw, cc.viewMetricsAndPadding.left + cc.viewMetricsAndPadding.right + c.width);
                } 
                else
                {
                    nh += c.height;
                    nw = Math.max( c.width, nw);
                }
            }
            this.measuredWidth = nw;
            this.measuredHeight = nh;
        }
    }
}

//测试代码，粘贴到你项目的主mxml中

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*">
    <mx:Script>
        <![CDATA[
            import mx.containers.Panel;
            import mx.containers.HBox;
            private function addOne():void
            {
                var hb:Panel = new Panel();
                hb.height = 100;
                hb.width = 100;
                hb.y = rc.numChildren * 110;
                rc.addChild( hb);
            }
        ]]>
    </mx:Script>
    <local:AutoResizeCanvas id="rc" verticalScrollPolicy="off" borderStyle="solid"/>
    <mx:Button x="497" y="10" label="Add HBox" click="addOne()"/>
</mx:Application>

【讨论】：