在帆布中適合Flex圖像

Question

如何在Flex中縮放圖像以適合Canvas？我的代碼如下：

<?xml version="1.0" encoding="utf-8"?> 
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
     horizontalAlign="center" 
     width="100" height="100" 
     verticalGap="0" borderStyle="solid" 
     initialize="onLoad()" 
     horizontalScrollPolicy="off" 
     verticalScrollPolicy="off"> 
    <mx:Canvas width="100%" height="100%" id="PictureBox" horizontalScrollPolicy="off" 
     verticalScrollPolicy="off" /> 
    <mx:Label id="NameLabel" height="20%" width="100%"/> 
    <mx:Script> 
     <![CDATA[ 
     private function onLoad():void 
     { 
      var image:SmoothImage = data.thumbnail; 

      image.percentHeight = 100; 
      image.percentWidth = 100; 
      this.PictureBox.addChild(image); 

      var sizeString:String = new String(); 

      if ((data.fr.size/1024) >= 512) 
       sizeString = "" + int((data.fr.size/1024/1024) * 100)/100 + " MB"; 
      else 
       sizeString = "" + int((data.fr.size/1024) * 100)/100 + " KB"; 

      this.NameLabel.text = data.name + " \n" + sizeString; 

     } 
     ]]> 
     </mx:Script> 
</mx:VBox> 

我試圖讓圖像：SmoothImage到PictureBox和縮小它。

注意 SmoothImage派生自Image。

Answer 1

，你需要確保你已經設置

image.scaleContent = true; 
image.maintainAspectRatio = false; 

這應該縮放內容以SWF加載程序的大小和distortin它，使其充滿Image組件的整個區域。

下面是它的工作

 <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
     horizontalAlign="center" 
     width="100" height="100" 
     verticalGap="0" borderStyle="solid" 
     initialize="onLoad()" 
     horizontalScrollPolicy="off" 
     verticalScrollPolicy="off"> 
    <mx:Canvas width="100%" height="100%" id="PictureBox" horizontalScrollPolicy="off" 
     verticalScrollPolicy="off" /> 
    <mx:Label id="NameLabel" height="20%" width="100%"/> 
    <mx:Script> 
     <![CDATA[ 
      import mx.controls.Image; 

     private function onLoad():void 
     { 
      var image : Image = new Image() 
      image.source = "http://i.stackoverflow.com/Content/Img/stackoverflow-logo-250.png"; 
      image.scaleContent = true; 
      image.maintainAspectRatio =false; 
      image.percentWidth = 100; 
      image.percentHeight = 100; 

      PictureBox.addChild(image); 

     } 
     ]]> 
    </mx:Script> 
</mx:VBox>