如何使我的容器与使用数据绑定的窗口保持相同的大小?

时间:2014-07-22 11:15:44

标签: flex actionscript

这只是一个简化的案例,并不是我真正想要达到的目标。我想找到一个解决方案来处理这样的问题。

我尝试了两种方法,但容器的大小有时与窗口不同。我认为这可能是因为Flex的邀请验证模式。


1。 Flash版本在我的Chrome浏览器中正常运行。 AIR版本并没有像我预期的那样发挥作用。程序启动时,容器没有大小。它的宽度和高度均为0.当我最大化窗口时,它仍然很小。当我最小化窗口时,它的大小将变为全屏。

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                       xmlns:s="library://ns.adobe.com/flex/spark" 
                       xmlns:mx="library://ns.adobe.com/flex/mx">

    <s:SkinnableContainer id="container" width="{width}" height="{height}"
                          backgroundColor="0x00FFFF"/>
</s:WindowedApplication>

2。 当AIR版本没有时,Flash版本正常工作。当我最大化窗口时,它仍然很小。当我最小化窗口时,它的大小将变为全屏。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx"
               creationComplete="application1_creationCompleteHandler(event)">

    <fx:Script>
        <![CDATA[
            import mx.binding.utils.BindingUtils;
            import mx.events.FlexEvent;
            import mx.utils.StringUtil;

            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                setInterval(traceWidthAndHeight, 1000);

                BindingUtils.bindProperty(container, 'width', this, 'width');
                BindingUtils.bindProperty(container, 'height', this, 'height');
            }

            private function traceWidthAndHeight():void
            {
                trace(StringUtil.substitute('width: {0}, height: {1}\ncontainer.width: {2}, container.height: {3}',
                    width, height, container.width, container.height));
            }

        ]]>
    </fx:Script>

    <s:SkinnableContainer id="container"
                          backgroundColor="0x00FFFF"/>
</s:Application>

我知道100%的宽度和高度可以达到我的目标。但是,我想知道是否可以使用数据绑定来完成。提前谢谢。

1 个答案:

答案 0 :(得分:0)

解决方案是使用布局,因此在窗口上设置垂直(或水平)布局,然后将容器宽度和高度设置为100%

样本mxml

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                       xmlns:s="library://ns.adobe.com/flex/spark" 
                       xmlns:mx="library://ns.adobe.com/flex/mx">
    <s:layout>
        <s:VerticalLayout paddingBottom="12" paddingLeft="12" paddingRight="12" paddingTop="12"/>
    </s:layout>
<s:BorderContainer width="100%" height="100%" borderColor="blue"/>
</s:WindowedApplication>