加载的图像调整大小后调整大小布局

问题描述:

所以我在这个mx中加载了一个非常大的图片:图像manteinAspectRatio启用了高度限制,并且照常不工作(Flex绝对不适用于我):加载的图像调整大小后调整大小布局

<?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"> 

     <s:Rect top="0" right="0" bottom="0" left="0"> 
      <s:fill> 
       <mx:SolidColor color="#000000"/> 
      </s:fill> 
     </s:Rect> 

     <s:VGroup id="a" top="0" right="0" bottom="0" left="0" horizontalAlign="center" verticalAlign="middle"> 

      <s:Group id="b"> 

       <s:Rect id="c" top="0" right="0" bottom="0" left="0" radiusX="10" radiusY="10"> 
        <s:fill> 
         <mx:SolidColor color="#cccccc"/> 
        </s:fill> 
       </s:Rect> 

       <s:VGroup id="d" paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10"> 

        <mx:Image id="e" source="big.jpg" maxHeight="300" maintainAspectRatio="true" /> 

       </s:VGroup> 

      </s:Group> 

     </s:VGroup> 

    </s:Application> 

big.jpg的宽度比高度大,所以当它被调整大小时,包装容器会得到正确的新高度,但它们仍然具有旧宽度。

我试图调用validateNow()的每一个元素上,无效,使用callLater(),调整大小事件,竞争事件......我是一个小白已经厌倦了AS 3.0

UPDATE:

阅读J_A_X答案,我结束了与此:

<?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"> 

    <fx:Script> 
     <![CDATA[ 

     import flash.events.Event; 
     import mx.controls.Image; 

     private function fix(event:Event):void { 

      var img:Image = event.target as Image; 
      var h:uint = 300; 

      img.width *= h/img.height; 
      img.height = h; 
      img.removeEventListener("updateComplete", fix); 

     } 

     ]]> 
    </fx:Script> 

    <s:Rect top="0" right="0" bottom="0" left="0"> 
     <s:fill> 
      <mx:SolidColor color="#000000"/> 
     </s:fill> 
    </s:Rect> 

    <s:VGroup top="0" right="0" bottom="0" left="0" horizontalAlign="center" verticalAlign="middle"> 

     <s:Group> 

      <s:Rect top="0" right="0" bottom="0" left="0" radiusX="10" radiusY="10"> 
       <s:fill> 
        <mx:SolidColor color="#cccccc"/> 
       </s:fill> 
      </s:Rect> 

      <s:VGroup paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10"> 

       <mx:Image source="big.jpg" maintainAspectRatio="false" updateComplete="fix(event)" /> 

      </s:VGroup> 

     </s:Group> 

    </s:VGroup> 

</s:Application> 

我希望帮助一个又一个处理的Flex。

+0

我还没有尝试你的代码,但也许你应该尝试没有这么多的容器。其中有一个可以调整图像大小。 – papachan 2011-06-02 16:12:36

+0

我不明白什么是不工作。什么是包装容器?你为什么期望容器自己调整大小?你的代码中没有任何东西让我认为它应该。您是调整图像大小,还是保持原样?这是你的完整代码吗? – JeffryHouser 2011-06-02 16:30:00

查看图像后,它似乎需要明确的高度/宽度,否则它不会正确缩小。这是有点愚蠢的不扩展到maxHeight,但你可以总是使用Flex 4.5 Image类,或者只是创建自己的处理最大高度/宽度。