2009-08-06 117 views
2
 
What is the best way to create applications in Flex/AIR, 
which look and feel the same irrespective of the screen 
resolution? 

回答

3

當在創建Flex應用程序佈局,可以實現一致屏幕分辨率獨立的外觀和使用相對比例感覺。

這與使用HTML創建液體佈局非常類似。例如,要創建一個簡單的雙列應用程序 - 左側導航和內容 - 您只需要兩個容器,一個預定義的和一個左側的無限縮放比例。

如下:

<mx:HBox width="225"> 
    <mx:Button label="Menu 1"/> 
    <mx:Button label="Menu 2"/> 
    <mx:Button label="Menu 3"/> 
</mx:HBox> 
<mx:HBox width="100%"> 
    Any content here will flow fluidly across the entire screen regardless of window size/screen resolution. 
</mx:HBox> 

使用上面的基礎,你可以創建形成任何屏幕的應用佈局。


然而,有時你需要創建有很多交換組件動態調整以適應窗口更精細的佈局方案。

爲此你可以做絕對定位。 重寫組件updateDisplayList()函數並創建您自己的大小/定位規則。

這當然要求您在Canvas容器內或主應用程序容器設置爲絕對佈局。

一個簡單的例子:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Script> 
     override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number) : void 
     { 
      //find out how big we are 
      var stageWidth:int = this.width; 
      //center the box in the middle of the page. 
      centeredBox.x = stageWidth - (centeredBox/2); 
     } 
    </mx:Script> 
    <mx:HBox id="centeredBox" width="500"/> 
</mx:Application> 

通過覆蓋的updateDisplayList(),您可以創造無限的方式來更好的動態位置和大小的部件,以更好地利用屏幕不動產。

0

您可以創建一個具有與容器相關的高度和寬度的應用程序,以便所有組件都能在所有屏幕分辨率下正確地自行對焦。

0

我們通常會創建一個MainFrame.mxml,它充當我們的主要組件,並具有其他組件提及的佈局相對縮放。然後我們創建AIR應用程序,它只嵌入一個MainFrame.mxml,另一個嵌入它的Flex應用程序。這樣我們可以將整個應用程序保留在MainFrame中,而不用擔心它是否在Flex或Air中。這就是說,您需要確保您不使用任何AIR特定或Flex特定的不會轉換到另一個特定的調用。

相關問題