Apache flex 如何强制从子级调整到父级

Apache flex 如何强制从子级调整到父级,apache-flex,actionscript,canvas,resize,Apache Flex,Actionscript,Canvas,Resize,我有一个类似flex应用程序的页面。在我的主应用程序中,有一个显示所有页面的支架(画布)。问题在于,当主应用程序启动时,装载在支架内的组件比支架大。支架高度设置为100%,但当我在他体内装入一个比他更大的部件时,他仍然会得到滚动条 我怎样才能解决这个问题?如果它不可解,如果我使用viewstack,它会正常工作吗 --更新--- 支架看起来像这样: <mx:canvas height="100%"> </canvas> 但是应用程序的末尾要低500像素,所以画布高度

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

我怎样才能解决这个问题?如果它不可解,如果我使用viewstack,它会正常工作吗

--更新---

支架看起来像这样:

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


但是应用程序的末尾要低500像素,所以画布高度要高500像素。现在我把一个新的孩子放在1000像素高的支架里。现在,在将组件添加到主画布之前,保持架高度应为1000像素,检查子组件的大小,查看其是否大于父组件。如果是,那么您可以在对象上使用scaleX和scaleY来缩小它,以适合您定义的区域

您在问题中声明的是任何flex容器的默认行为。。。把更大的东西放进去,你会看到滚动条。要消除滚动条,请使用:

horizontalScrollPolicy="off"
verticalScrollPolicy="off
编辑:


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

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

您在问题中声明的是任何flex容器的默认行为。。。把更大的东西放进去,你会看到滚动条。要消除滚动条,请使用:

horizontalScrollPolicy="off"
verticalScrollPolicy="off
编辑:


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

这是我一直在玩的自动调整画布大小的代码

//另存为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;
        }
    }
}
包
{
导入mx.containers.Canvas;
导入mx.core.Container;
导入mx.core.ui组件;
公共类AutoResizeCanvas扩展画布
{
公共函数AutoResizeCanvas()
{
超级();
}
重写受保护的函数度量值():void
{
super.measure();
var-nh:int=0;
var nw:int=0;
for(var n:int=0;n
//测试代码,粘贴到项目的主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>

这是我一直在玩的自动调整画布大小的代码

//另存为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;
        }
    }
}
包
{
导入mx.containers.Canvas;
导入mx.core.Container;
导入mx.core.ui组件;
公共类AutoResizeCanvas扩展画布
{
公共函数AutoResizeCanvas()
{
超级();
}
重写受保护的函数度量值():void
{
super.measure();
var-nh:int=0;
var nw:int=0;
for(var n:int=0;n
//测试代码,粘贴到项目的主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>


也许我需要更好地解释一下:我有一个支架。在应用程序开始时,100%的支架高度意味着他有500像素高。现在,我在支架内添加了一个1000像素高的新子级。但支架仍然保持500像素高。但应该是1000像素明白了。。。将任何元素的高度设置为100%并不意味着它将根据其子元素调整大小。。。它将100%地分配给其父对象。您可以将TabNavigator与resizeToContent=“true”配合使用,resizeToContent也可以在viewstack上使用,我现在找到了另一种解决方案。首先,如果我在支架上添加了一个儿童,我会将儿童身高设置为100%。如果将其设置为1000,支架将正确调整大小。糟糕的是,这不是动态的。我仍然喜欢动态解决方案如果viewstack支持resizeToContent,我想这是最干净的解决方案,也许我需要更好地解释一下:我有一个支架。在应用程序开始时,100%的支架高度意味着他有500像素高。现在,我在支架内添加了一个1000像素高的新子级。但支架仍然保持500像素高。但应该是1000像素明白了。。。将任何元素的高度设置为100%并不意味着它将根据其子元素调整大小。。。它将100%地分配给其父对象。您可以将TabNavigator与resizeToContent=“true”配合使用,resizeToContent也可以在viewstack上使用。我现在找到了另一种解决方案