移動影片片段範例:RuntimeAssetsExplorer

Flash Player 9 以及更新的版本,Adobe AIR 1.0 以及更新的版本

對用於一個以上專案的元件庫而言,「匯出給 ActionScript 使用」功能特別有用。如果 Flash Player 或 AIR 執行 SWF 檔,匯出至 ActionScript 的元件可供將它載入的同一個安全執行程序內的任何 SWF 檔使用。使用這種方式,單一 Flash 文件就可以產生一個 SWF 檔,並指定它只能用來存放圖像資源。這項技巧特別適用於大型專案,使用視覺資源的設計人員可以和以後會建立「包裝函式」SWF 檔並在執行階段載入圖像資源 SWF 檔的開發人員一起協同作業。您可以使用這個方法來維護一系列的檔案版本,讓圖像資源獨立於程式設計開發的進度之外。

RuntimeAssetsExplorer 應用程式會載入本身是 RuntimeAsset 之子類別的任何 SWF 檔,可以讓您瀏覽該 SWF 檔的可用資源。此範例將說明下列各項:

  • 使用 Loader.load() 載入外部 SWF 檔

  • 以動態方式建立匯出給 ActionScript 使用的元件庫元件

  • 控制 MovieClip 播放的 ActionScript 控制項

在開始之前,請注意在 Flash Player 中執行的每一個 SWF 檔都必須位於相同的安全執行程序中。如需詳細資訊,請參閱安全執行程序

若要取得此樣本的應用程式檔案,請下載 Flash Professional 樣本。您可以在 Samples/RuntimeAssetsExplorer 檔案夾中找到 RuntimeAssetsExplorer 應用程式檔案。此應用程式是由下列檔案組成:

檔案

說明

RuntimeAssetsExample.mxml

RuntimeAssetsExample.fla

應用程式使用者介面,在 Flash 中為 FLA,在 Flex 中為 MXML。

RuntimeAssetsExample.as

Flash (FLA) 應用程式的文件類別

GeometricAssets.as

實作 RuntimeAsset 介面的類別範例。

GeometricAssets.fla

一個連結到 GeometricAssets 類別 (FLA 的文件類別) 的 FLA 檔,該類別包含匯出供 ActionScript 使用的元件。

com/example/programmingas3/runtimeassetexplorer/RuntimeLibrary.as

介面,定義將載入至 Explorer 容器之所有執行階段資源 SWF 檔所需的方法。

com/example/programmingas3/runtimeassetexplorer/AnimatingBox.as

在旋轉方塊的圖形中之元件庫元件類別。

com/example/programmingas3/runtimeassetexplorer/AnimatingStar.as

在旋轉星形的形狀中之元件庫元件類別。

建立執行階段元件庫介面

為使 Explorer 可以與 SWF 元件庫適當地互動,必須先將執行階段資源元件庫的結構形式化。為完成這項作業,我們將先建立一個介面,它與類別類似,因為它是用來界定預期結構的方法藍圖,但與類別不同的是,它不包括方法主體。此介面可提供一種方法,讓執行階段元件庫與 Explorer 互相通訊。載入至瀏覽器的每一個執行階段資源 SWF 都將實作這個介面。如需有關介面以及它們如何能更有用的詳細資訊,請參閱「學習 ActionScript 3.0」中的「介面」。

RuntimeLibrary 介面會很簡單,只需要使用一個函數,就可以將要匯出並可在執行階段元件庫中使用的元件類別路徑陣列提供給結構檢視器。在最後的結果中,這個介面將具有一個方法:getAssets()

package com.example.programmingas3.runtimeassetexplorer 
{ 
    public interface RuntimeLibrary 
    { 
        function getAssets():Array; 
    } 
}

建立資源元件庫 SWF 檔

藉由定義 RuntimeLibrary 介面,便可以建立多個能夠載入至其它 SWF 檔的資源元件庫 SWF 檔。建立 SWF 資源元件庫包括四項工作:

  • 建立資源元件庫 SWF 檔的類別

  • 為元件庫中包含的個別資源建立類別

  • 建立實際的圖像資源

  • 將圖像元素與類別建立關聯,然後發佈這個元件庫 SWF

建立類別以實作 RuntimeLibrary 介面

接著,我們將建立 GeometricAssets 類別來實作 RuntimeLibrary 介面。這將變成 FLA 的文件類別。此類別的程式碼與 RuntimeLibrary 介面非常類似,它們之間的差異是在類別定義中 getAssets() 方法具有方法主體。

package 
{ 
    import flash.display.Sprite; 
    import com.example.programmingas3.runtimeassetexplorer.RuntimeLibrary; 
     
    public class GeometricAssets extends Sprite implements RuntimeLibrary  
    { 
        public function GeometricAssets() { 
             
        } 
        public function getAssets():Array { 
            return [ "com.example.programmingas3.runtimeassetexplorer.AnimatingBox", 
                     "com.example.programmingas3.runtimeassetexplorer.AnimatingStar" ];     
        } 
    } 
}

如果我們先建立第二個執行階段元件庫,就可以依據其它可以提供其 getAssets() 實作的類別 (例如,AnimationAssets) 來建立另一個 FLA。

建立每一個 MovieClip 資源的類別

在這個範例中,我們將只擴充 MovieClip 類別,而不將任何功能加入自訂資源。下列 AnimatingStar 的程式碼與 AnimatingBox 的程式碼很類似:

package com.example.programmingas3.runtimeassetexplorer 
{ 
    import flash.display.MovieClip; 
     
    public class AnimatingStar extends MovieClip 
    { 
        public function AnimatingStar() { 
        } 
    } 
}

發佈元件庫

現在我們藉由建立新的 FLA,並在「屬性」檢測器的「文件類別」欄位中輸入 GeometricAssets,將 MovieClip 架構的資源連接至新的類別。為了達到這個範例的目標,我們將建立兩個很基本的形狀,這兩個形狀會使用時間軸補間動畫對 360 個影格進行逆時針方向旋轉。將 animatingBoxanimatingStar 元件設為「匯出給 ActionScript 使用」,並將「類別」欄位設為 getAssets() 實作中指定的各個類別路徑。在我們將標準 MovieClip 方法設為子類別時,flash.display.MovieClip 的預設基底類別仍然維持不變。

設定元件的匯出設定之後,發佈 FLA。您現在已經擁有您的第一個執行階段元件庫。這個 SWF 檔可以載入至另一個 AVM2 SWF 檔,而且新的 SWF 檔就可以使用 AnimatingBox 和 AnimatingStar 元件。

將元件庫載入至另一個 SWF 檔

最後要處理的函數部分是資源檢視器的使用者介面。在此範例中,執行階段元件庫的路徑是以硬式編碼的方式編碼為 ASSETS_PATH 變數。或者,您也可以使用 FileReference 類別。例如,建立介面來瀏覽硬碟中特定的 SWF 檔。

成功載入執行階段元件庫後,Flash Player 就會呼叫 runtimeAssetsLoadComplete() 方法:

private function runtimeAssetsLoadComplete(event:Event):void 
{ 
    var rl:* = event.target.content; 
    var assetList:Array = rl.getAssets(); 
    populateDropdown(assetList); 
    stage.frameRate = 60; 
}

在此方法中,變數 rl 代表被載入端 SWF 檔。程式碼會呼叫被載入端 SWF 檔的 getAssets() 方法,以取得可用的資源清單,並呼叫 populateDropDown() 方法,將清單中的可用資源填入 ComboBox 組件。該方法接著會儲存每個資源的完整類別路徑。按一下使用者介面上的「增加」按鈕會觸發 addAsset() 方法:

private function addAsset():void 
{ 
    var className:String = assetNameCbo.selectedItem.data; 
    var AssetClass:Class = getDefinitionByName(className) as Class; 
    var mc:MovieClip = new AssetClass(); 
    ... 
}

這會取得 ComboBox (assetNameCbo.selectedItem.data) 中目前選取之資源的類別路徑,並且為了建立該資源的新實體,還會使用 getDefinitionByName() 函數 (來自於 flash.utils 套件) 取得該資源之類別的實際參考。