无法通过动作脚本正确调整图像大小

问题描述:

嗨我试图在点击缩略图时添加图像。 我知道我必须使用一个侦听器(Event.COMPLETE?),但是当我旋转平板电脑时图像不能正确调整大小。无法通过动作脚本正确调整图像大小

我相信问题在于我无法调整addImage1()函数中的图像大小,因为图像尚未加载,但我无法在侦听器函数中使用newImg.width来重置图像宽度。

任何帮助将不胜感激。 代码如下:-)

<?xml version="1.0" encoding="utf-8"?> 
    <s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" title="ZOOM Pictues with Tap" 
    resize="view1_resizeHandler(event)"> 

<s:layout> 
     <s:VerticalLayout/> 
    </s:layout> 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
    <![CDATA[ 

    import mx.events.FlexEvent; 
    import mx.events.ResizeEvent; 

    public var hasImageBeenAdded:Boolean = false; 
    private var imageLastWidth:Number; 
    private var imageLastHeight:Number; 
    private var zoomFactor:Number; 
    private var imageNumber:Number; 

    private var rhsKeepWidth:int; 
    private var rhsKeepHeight:int; 
    private var rhsKeep:Boolean = false; 

    protected function view1_resizeHandler(event:ResizeEvent):void 
    { 

     if(rhsKeepWidth > rhsKeepHeight) // Was Landscape is now Portrait 
     { 
     var tmpWidth2:int = rhsKeepWidth; 
     var tmpHeight2:int = rhsKeepHeight; 
     rhsKeepWidth = tmpHeight2-lhs.width; 
     rhsKeepHeight = tmpWidth2+lhs.width;     
     } 
     else //Was Portrait is now Landscape 
     { 
     var tmpWidth1:int = rhsKeepWidth; 
     var tmpHeight1:int = rhsKeepHeight; 
     rhsKeepWidth = tmpHeight1-lhs.width; 
     rhsKeepHeight = tmpWidth1+lhs.width; 
     } 
     addImage1(); 
    } 

    protected function removeAllImages():void 
    {  
     var totalElements : int = rhs.numElements; 
     for(var i:int=totalElements-1;i>=0;i--) 
     { 
     rhs.removeElementAt(i); 
     } 
    } 

    private function onImageLoaded(e:Event):void 
    { 
     var zoomFactor1:Number; 
     var zoomFactor2:Number; 

     imageLastWidth = e.target.sourceWidth; 
     imageLastHeight = e.target.sourceHeight; 

     if(rhsKeep != true) //Need to set the rhs VGroup dimensions 
     { 
     rhs.width = hGroup1.width-lhs.width; 
     rhs.height = hGroup1.height; 
     rhsKeep = true; 
     rhsKeepWidth = rhs.width; 
     rhsKeepHeight = rhs.height; 
     } 

     zoomFactor1 = rhsKeepWidth/imageLastWidth; 
     zoomFactor2 = rhsKeepHeight/imageLastHeight; 

     if(zoomFactor1 < zoomFactor2) 
     { 
     zoomFactor = zoomFactor1; 
     } 
     else 
     { 
     zoomFactor = zoomFactor2; 
     } 
     trace("zoomFactor=" + zoomFactor); 
    } 

    public function addImage1():void 
    { 
     var i:int; 
     var newImg:Image = new Image(); 
     removeAllImages(); 
     newImg.source = "images/1.jpg"; 
     newImg.x = 0; 
     newImg.y = 0; 
     newImg.addEventListener(Event.COMPLETE,onImageLoaded); 
     rhs.addElementAt(newImg,0); 
     hasImageBeenAdded = true; 
     imageNumber = 1; 
     trace("Image Width= " + newImg.width); 
     newImg.scaleX = newImg.scaleY = zoomFactor; 
    } 

    ]]> 
    </fx:Script> 


    <s:HGroup id="hGroup1" width="100%" height="100%">  
     <s:Scroller id="scrollerL" height="100%"> 
     <s:VGroup id="lhs" width="15%" height="100%" gap="10" 
     horizontalAlign="center" verticalAlign="top"> 
      <s:Image width="100" height="100" source="thumbs/1.jpg" click="addImage1()"/> 
     </s:VGroup> 
     </s:Scroller> 

     <s:Scroller id="scroller1" height="100%" width="100%"> 
     <s:VGroup id="rhs" height="100%"> 
     </s:VGroup> 
     </s:Scroller> 
    </s:HGroup> 


    </s:View> 

关于设备的方向,你应该使用:

trace(Stage.deviceOrientation); 
trace(Stage.orientation); 

它们是只读的字符串输出有关设备的与屏幕的方位信息。您可以手动设置舞台的方向:

Stage.setOrientation(StageOrientation.DEFAULT); 

关于图像加载,你需要为Event.COMPLETE的事件监听,你也应该投的内容图片:

var loader:Loader = new Loader(); 
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(event:Event):void { 
    trace("Image loaded"); 
    // Handle code here 
    // Use: (loader.content as Image) 
}); 
loader.load(new URLRequest("images/1.jpg"));