[轉][Starling] 神器——原生Swf一鍵匯出到Starling!

標籤：

Swf一鍵匯出到Starling中的工具，在Starling使用原生的MovieClip來自：http://zmliu.github.io/2013/11/09/StarlingSwfTool/如果你喜歡這個工具，請點擊進入以上地址支援作者原創。

有些同學使用過程用遇到了問題。我開了一個QQ群。有問題的同學可以進來問一下群號是168436154

目錄

1. StarlingSwf是什麼

2. 功能與特色

3. 下載與安裝

4. 教程一：資源命名規則

5. 教程二：針對設計師

6. 教程三：針對程式

7. 教程四：MovieClip自動停止播放

8. 教程五：擷取介面上的元素

9. 教程六：ATF大量匯出工具如何使用

10. 成功案例

StarlingSwf是什麼

StarlingSwf是一套開源的 Swf資料匯出到Starling架構中使用的工具.

他可以讓開發匯出Swf資料到Starling中渲染

功能與特色

1. 匯出Swf資料到Starling中

2. 在Starling中還原Swf中原件的層級關係、動畫、原件屬性

3. 支援原件嵌套，動畫嵌套

4. MovieClip基本還原了傳統Flash的MovieClip

5. 使用了類似骨骼動畫的思想，記憶體佔用低、運行效率高

6. 自動合并紋理，並且可以自動單獨匯出大圖

下載與安裝(點我)教程一：原件命名規則

既然是Swf那麼資源的編輯肯定還是用Flash Pro了，但是資源的命名規則大家需要注意下(是AS連結名稱噢)

1. img 開始會被識別為starling.display.Image.(這個必須是元件。不能直接用圖片,匯出之後該原件會直接被映射為一張圖片)

2. s9 開頭會被識別為feathers.display.Scale9Image.(製作規則跟傳統flash開發一樣)

3. btn 開頭會被識別為lzm.starling.display.Button.(Button中使用的任意顯示對象必須是img s9 btn mc spr中製作的對象)

4. mc 開頭會被識別為lzm.starling.swf.display.SwfMovieClip.(MoviecClip中使用的任意顯示對象必須是img s9 btn mc spr中製作的對象)

5. spr 開頭會被識別為starling.display.Sprite.(Sprite中使用的任意顯示對象必須是img s9 btn mc spr中製作的對象)

6. 文本 文本比較特殊 只要在img s9 btn mc spr 中寫就可以了

7. shapeImg 開頭會被識別為lzm.starling.swf.display.ShapeImage,使用紋理填充的圖片(紋理長寬需要為2的冪數,改變組建寬高時，會自動使用初始化的Texture填充)

教程二：針對設計師

1.作為設計師，你只需要準備好需要展示的圖片，在FlashPro中將他們有序的組裝起來。並且為需要匯出的原件設定連結就可以了搞定一切

2.開啟庫面板，你可以看到此樣本的相關資源.

3.相關資源編輯好之後匯出Swf.

4.開啟StarlingSwf匯出工具，選擇剛剛匯出的swf.選擇上方的下拉框，預覽在Swf內部的原件在Starling中是什麼樣子.

5.選擇匯出倍數，然後匯出.資源匯出後會出現兩個檔案夾

data下面放的Swf資料,images下放的所有匯出的圖片.將這兩個東西給程式就可以了.

教程三：針對程式

1.建立一個Actionscript工程。(demo中是手機工程)

2.倒入資源

3.倒入依賴庫

4.代碼

關鍵代碼

//初始化SwfSwf.init(Starling.current.nativeStage);//建立一個Swf(`layout`對應產生`.bytes`檔案的名字)var swf:Swf=newSwf(assets.getByteArray("layout"),assets);//根據as串連名稱建立 顯示對象swf.createSprite("spr_1");swf.createMovieClip("mc_test1");swf.createImage("img_test1");swf.createButton("btn_test1");swf.createS9Image("s9_test1");

demo中的主要代碼

package{import flash.display.StageAlign;import flash.display.StageScaleMode;import lzm.starling.STLStarup;publicclassStarlingSwfTestMainextendsSTLStarup{publicfunctionStarlingSwfTestMain(){super();// 支援 autoOrientstage.align =StageAlign.TOP_LEFT;stage.scaleMode =StageScaleMode.NO_SCALE;stage.color =0x999999;stage.frameRate =60;initStarling(StarlingSwfTestMainClass);}}}package{import flash.filesystem.File;import lzm.starling.STLConstant;import lzm.starling.STLMainClass;import lzm.starling.gestures.DragGestures;import lzm.starling.swf.Swf;import starling.core.Starling;import starling.display.Sprite;import starling.text.TextField;import starling.utils.AssetManager;import starling.utils.formatString;publicclassStarlingSwfTestMainClassextendsSTLMainClass{privatevar textfield:TextField;publicfunctionStarlingSwfTestMainClass(){super();Swf.init(Starling.current.nativeStage);textfield =newTextField(200,100,"loading....");textfield.x =(STLConstant.StageWidth- textfield.width)/2;textfield.y =(STLConstant.StageHeight- textfield.height)/2;addChild(textfield);var assets:AssetManager=newAssetManager(STLConstant.scale,STLConstant.useMipMaps);var file:File=File.applicationDirectory;assets.enqueue(file.resolvePath(formatString("assets/{0}x/",STLConstant.scale)));assets.loadQueue(function(ratio:Number):void{textfield.text ="loading...."+int(ratio*100)+"%";if(ratio ==1){textfield.removeFromParent(true);var swf:Swf=newSwf(assets.getByteArray("layout"),assets);var sprite:Sprite= swf.createSprite("spr_1");addChild(sprite);newDragGestures(sprite);}});}}}

5.運行效果

教程四：MovieClip自動停止播放

很多時候需要讓動畫播放完畢之後自動停止在最後一幀，在工具中也可以很簡單的實現

1. 倒入swf

2. 從MovieClip列表中 選中需要自動停止的MC

3. 取消是否迴圈

教程五：擷取介面上的元素

很簡單，首先給元素命名

然後使用getChildByName擷取

教程六：ATF大量匯出工具如何使用移步到這裡成功案例戰略傳奇船長也瘋狂天天爆爆

友情提示：工具的預覽地區是可以拖動的噢

• Tool 4

• ← Previous
• Archive
• Next →

[轉][Starling] 神器——原生Swf一鍵匯出到Starling!