如何持續更新基於contentHeight的圖像？

我很難說我的問題在這裏，所以請裸露在我身邊：如何持續更新基於contentHeight的圖像？

我想繪製一個圖像背後的純色背景。圖像是一個橫幅，佔用了我畫布頂部的33％，除非它超出了它的縱橫比。這就是背景顏色的來源;在圖像填充最大寬度後，背景顏色會填充剩餘內容的右側，而不會超出33％的高度或寬高比。

我的問題是，用下面的代碼，它只檢查一次contentHeight，因此，如果圖像高度降低到最初加載的以下，我的背景顏色可以在圖像下面看到（不需要）。我無法使用我的圖像高度，因爲有時我的圖像高度超過了實際顯示的高度（因爲維護AspectRatio）。

是否有人知道如何在與內容匹配而不是容器的任何時候獲得圖像的一致（可綁定）高度？

我完全可以接受，我正在接近這個錯誤的方式，所以任何替代方法，這種方法有相同的預期結果將不勝感激。謝謝。

組件：

<mx:Canvas id="mainCanvas" width="100%" height="100%"> 
    <mx:HBox x="0" y="0" backgroundColor="{myBgColor}" width="100%" height="{Math.min(myImg.contentHeight, mainCanvas.height * 0.33)}" /> 
    <mx:Image id="myImg" source="{myImageSrc}" maintainAspectRatio="true" width="100%" height="33%"/> 
</mx:Canvas>

來源

2014-04-21 buddyp450

我的（未經測試）的建議是使用complete處理器的Image（火花，不是MX）：

<fx:Script> 
<![CDATA[ 

function myComplete(event:Event) { 
    myBox.height = Math.min(myImg.contentHeight, mainCanvas.height * 0.33); 
} 

]]> 
</fx:Script> 

<mx:Canvas id="mainCanvas" width="100%" height="100%"> 
    <mx:HBox id="myBox" x="0" y="0" backgroundColor="{myBgColor}" width="100%" /> 
    <s:Image id="myImg" complete="myComplete(event)" source="{myImageSrc}" maintainAspectRatio="true" width="100%" height="33%"/> 
</mx:Canvas>

此外，我不明白你爲什麼使用HBox中而不是圖像的backgroundColor ...

來源

2014-04-21 09:48:26

我不能使用圖像的背景顏色，因爲這將包括當正在維持縱橫比導致它着色的實際圖像下方的整體容器。 – buddyp450

最終不得不在我的圖像上使用resize處理程序，因爲完整的處理程序從未爲我的嵌入式圖像源。我僅限於使用Flex 3，因此沒有可用的火花組件。下面

解決方案：

protected function resizeHandler(event:ResizeEvent):void 
{ 
    var newHeight = Math.round(Math.min(myImg.contentHeight, mainCanvas.height * 0.33)) - 1; // Magic -1 because image had a bottom white padding 
    blueBg.height = newHeight; 
}

來源

2014-04-21 12:23:27 buddyp450

如何持續更新基於contentHeight的圖像？

回答

相關問題