AIR中的原生視窗基本概念Adobe AIR 1.0 以及更新的版本 如需瞭解在 AIR 中使用原生視窗的快速說明與程式碼範例,請參閱 Adobe Developer Connection 中的快速入門文章:
AIR 提供容易使用的跨平台視窗 API,可供使用 Flash®、Flex™ 和 HTML 程式設計技巧,建立原生作業系統視窗。 有了 AIR,在開發應用程式的外觀時,您可具備寬廣的自由發揮空間。您可以讓所建立的視窗可以在外觀上接近標準的桌面應用程式:在 Mac 上執行時與 Apple 的樣式相符、在 Windows 上執行時與 Microsoft 傳統慣例一致,在 Linux 上又能與視窗管理員產生協調。而且,您完全不需要針對平台來插入專用的程式碼便能夠達成此目的。或者,您也可以使用由 Flex 架構所提供的可設定外觀與可擴充顏色來自行建立樣式,無論應用程式是在哪種系統上執行都沒問題。甚至,您還可以使用向量和點陣圖圖案,自行繪製視窗的顏色,並完整支援桌面的透明度與 Alpha 混合效果。看膩了矩形視窗嗎?何不使用圓角視窗呢? AIR 中的視窗AIR 支援三種視窗專用的 API:
ActionScript 視窗當您使用 NativeWindow 類別建立視窗時,請直接使用 Flash Player 舞台和顯示清單。若要將視覺物件加入 NativeWindow,請將物件加入視窗舞台的顯示清單或舞台上的另一個顯示物件容器。 HTML 視窗當您建立 HTML 視窗時,會使用 HTML、CSS 和 JavaScript 來顯示內容。若要將視覺物件加入 HTML 視窗,可以將該內容加入 HTML DOM。HTML 視窗是特殊類別的 NativeWindow。AIR 主機會在 HTML 視窗中定義 nativeWindow 屬性,以便存取基礎 NativeWindow 實體。您可以使用這個屬性來存取本節說明的 NativeWindow 屬性、方法和事件。 備註: JavaScript Window 物件也有方法可用來編寫所包含視窗的指令碼,例如 moveTo() 和 close()。如果有不同方法可供使用時,您可以使用最方便的方法。
原生視窗事件流程原生視窗會傳送事件,以通知需要知道的組件,將發生或已發生重要變更。許多視窗相關事件是成對傳送。第一個事件會警告即將發生變更。第二個事件會宣佈已發生變更。您可以取消警告事件,但不能取消通知事件。下面依序列出當使用者按一下視窗的最大化按鈕時所發生的事件流程:
控制原生視窗樣式和行為方式的屬性下列屬性可控制視窗的基本外觀和行為:
當您建立視窗時,要在傳遞給視窗建構函式的 NativeWindowInitOptions 物件上設定這些屬性。AIR 會從應用程式描述器讀取初始應用程式視窗的屬性 (但 type 屬性除外,此屬性無法在應用程式描述器中設定,而且永遠設定為 normal)。視窗建立後無法變更這些屬性。 這些屬性中有些設定是彼此互不相容的:如果 transparent 是 true 或 type 是 lightweight,則 systemChrome 無法設定為 standard。 視窗類型AIR 視窗類型是結合原生作業系統的顏色和可見性特質,建立三種功能性視窗類型。請使用定義於 NativeWindowType 類別中的常數,參考程式碼中的類型名稱。AIR 提供下列視窗類型:
視窗顏色視窗顏色是一組控制項,可以讓使用者在桌面環境中操控視窗。顏色元素包括標題列、標題列按鈕、邊框,和調整大小移駐夾。 系統顏色您可以將 systemChrome 屬性設定為 standard 或 none。選擇 standard 系統顏色可以提供您的視窗一組由使用者的作業系統所建立並訂定樣式的標準控制項。選擇 none 可將您的自訂顏色提供給視窗。請使用定義於 NativeWindowSystemChrome 類別中的常數,參考程式碼中設定的系統顏色設定。 系統顏色是由系統進行管理。您的應用程式無法直接存取控制項本身,但是可以在使用控制項時回應已傳送的事件。當您使用標準的視窗顏色時,transparent 屬性必須設定為 false,而且 type 屬性必須為 normal 或 utility。 Flex 顏色當您使用 Flex WindowedApplication 或 Window 組件時,視窗可以使用系統顏色或由 Flex 架構提供的顏色。若要使用 Flex 顏色,請將用來建立視窗的 systemChrome 屬性設定為 none。使用 Flex 4 Spark 組件,而不使用 MX 組件時,您必須指定外觀類別,才能使用 Flex 顏色。您可以使用內建外觀或提供自己的外觀。下列範例示範如何使用內建 Spark WindowedApplication 外觀類別來提供視窗顏色: <?xml version="1.0" encoding="utf-8"?> <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <fx:Style> @namespace "library://ns.adobe.com/flex/spark"; WindowedApplication { skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin"); } </fx:Style> </s:WindowedApplication> 如需詳細資訊,請參閱 Using Flex 4: About the AIR window containers: Controlling window chrome 視窗透明度若要允許使用桌面或其它視窗的視窗 Alpha 混合,請將視窗 transparent 屬性設定為 true。您必須先設定 transparent 屬性,才能建立視窗,而該屬性建立後無法再變更。 透明視窗沒有預設背景。應用程式所繪製且未包含物件的任何視窗區域是看不見的。如果顯示的物件具有小於一的 Alpha 設定值,則物件之下的任何項目 (包括相同視窗、其它視窗以及桌面中的其它顯示物件) 都會穿透顯示出來。 如果您所要建立的應用程式,其邊框的形狀不規則或「淡化」或看起來是隱形的,那麼透明視窗就很有用。不過,顯示大型 Alpha 混合區域的速度可能會很慢,因此請謹慎使用這種效果。 重要事項: 在 Linux 上,完全透明的像素不會傳遞滑鼠事件。您應該避免建立具有大塊完全透明區域的視窗,因為可能會阻礙使用者對其它視窗或桌面項目的存取。在 Mac OS X 和 Windows 上,完全透明的像素則可傳遞滑鼠事件。
透明度不能用於具有系統顏色的視窗。此外,HTML 中的 SWF 和 PDF 內容可能不會顯示於透明視窗。如需詳細資訊,請參閱在 HTML 網頁中載入 SWF 或 PDF 內容時必須考量的事項。 靜態 NativeWindow.supportsTransparency 屬性會報告視窗透明度是否可供使用。透明度不受支援時,應用程式就會與黑色背景混合。在這些情況下,應用程式中任何的透明區域會顯示為不透明的黑色。最好在此屬性的測試結果為 false 的情況下提供補救措施。例如,您可以向使用者顯示警告對話方塊,或顯示不透明的矩形使用者介面。 請注意,Mac 和 Windows 作業系統永遠都支援透明度。Linux 作業系統上的支援需要複合式視窗管理員,但即使當複合式視窗管理員在作用中,也可能因為使用者顯示選項或硬體組態的關係而無法產生透明度。 MXML 應用程式視窗中的透明度MXML 視窗的背景是預設為不透明的,即使您將視窗建立為 transparent 也是如此 (請注意視窗角落的透明度效果)。若要呈現視窗的透明背景,請在樣式表或應用程式 MXML 檔內所包含的 <mx:Style> 元素中設定背景顏色和 Alpha 值。例如,下列樣式宣告會讓背景呈現稍帶透明的綠色: WindowedApplication { background-alpha:".8"; background-color:"0x448234"; } HTML 應用程式視窗中的透明度根據預設,顯示於 HTML 視窗和 HTMLLoader 物件中的 HTML 內容背景是不透明的,即使包含的視窗是透明的也是如此。若要關閉為 HTML 內容顯示的預設背景,請將 paintsDefaultBackground 屬性設定為 false。下列範例會建立 HTMLLoader,並關閉預設背景: var htmlView:HTMLLoader = new HTMLLoader(); htmlView.paintsDefaultBackground = false; 此範例會使用 JavaScript 來關閉 HTML 視窗的預設背景: window.htmlLoader.paintsDefaultBackground = false; 如果 HTML 文件中的元素會設定背景顏色,該元素的背景就不是透明的。不支援設定部分透明度 (或不透明度) 值。但是,您可以使用透明 PNG 格式圖形做為頁面或頁面元素的背景,以達到類似的視覺效果。 視覺視窗類別目錄下表說明了在 Mac OS X、Windows 和 Linux 作業系統上不同視窗屬性設定組合的視覺效果:
*Ubuntu 和 Compiz 視窗管理員 備註: AIR 不支援下列系統顏色元素:Mac OS X 工具列、Mac OS X Proxy 圖示、Windows 標題列圖示,以及替代系統顏色。
|
|