图像对象白色背景显示

Question

我有一个 Image 对象，当图像加载时，该对象的大小会调整为容器大小。
它将加载的图像大小是动态的，因此在调整大小后，我最终会显示图像对象的白色背景。

如何使 Image 对象没有白色背景并且是透明的。
PNG 的某些部分具有透明部分，但由于加载对象的白色背景而显示为白色。

<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" headerHeight="20" >

  <mx:Script>
    <![CDATA[
      public function set source( val:String ):void{
        this.img.source = val;
      }
      private function onLoad( e:Event ):void{
        // resize image on load to fit
        var scale:Number = (this.height - 38) / this.img.contentHeight; // 38 is adjustment for headheight and padding
        this.img.scaleX = scale;
        this.img.scaleY = scale;
      }
    ]]> 
  </mx:Script>

  <!-- how do I make this image object have a transparent background -->
  <mx:Image id="img" complete="onLoad(event)" />

</mx:Panel>

[编辑] 在屏幕截图中可见的是 2 个由我在上面发布的代码制成的对象。
如您所见，有一个白色边框。

这是其中一个PNG
这个 png 在 350@PPI 有一个透明的 1 英寸边框，这是 72 PPI 所以有点小
你在这里显然看不到边框，但是如果你将它拖到桌面并在 Photoshop 中打开你会看到它

[编辑]
正如 SuperSaiyen 建议的那样，我将 backgroundColor="#000000" 添加到面板中，我得到了这个结果。如您所见，我现在有一个黑色边框。

所以我继续在面板中添加了 backgroundAlpha="0" 和 backgroundColor="#000000" 并得到了这个。

所以现在我几乎拥有它，但它周围仍然有蓝色。它还不是 100% 透明。
我真的不知道为什么面板背景会改变图像标签。
我猜想某种来自父母的继承正在发生。
仍然需要摆脱蓝色。

Answer 1

不要设置比例，试试这个：

<mx:Image id="img" height="{this.height-38}" maintainAspectRatio="true" />

我试图重现您的问题，即使使用比例尺，我也没有看到白色边框。

我有一个黑色边框，因为那是面板的背景...

<mx:Panel id="thePanel" headerHeight="20"
              horizontalAlign="center" verticalAlign="middle"
              height="200" width="150"
              backgroundColor="#000000">

        <!-- how do I make this image object have a transparent background -->
        <mx:Image id="img" height="{thePanel.height-38}" maintainAspectRatio="true" />

    </mx:Panel>

编辑： 因此，您看到的背景是面板后面的框的背景，而不是图像（请参阅面板上的 opaqueBackground 道具）。然后，您需要将面板的背景设置为与面板边框相同的颜色。面板是正确的容器吗？带圆角的 HBox 怎么样？

<mx:VBox id="thePanel" cornerRadius="4" backgroundColor="0xd1dbe9"
             horizontalAlign="center" verticalAlign="middle"
             height="200" width="150"
             paddingBottom="5" paddingLeft="5" paddingTop="5">
        <mx:Label text="Bind to title String" />
        <mx:Image id="img" width="100%" height="100%"/>
    </mx:VBox>