Egret之MC逐幀動畫-創(chuàng)新互聯(lián)

此處Egret逐幀動畫借助Flash以及Texture Merger工具來生成文件( 1:動畫描述文件Json , 動畫圖集文件 )

創(chuàng)新互聯(lián)專注于中大型企業(yè)的成都網(wǎng)站制作、網(wǎng)站設(shè)計和網(wǎng)站改版、網(wǎng)站營銷服務(wù),追求商業(yè)策劃與數(shù)據(jù)分析、創(chuàng)意藝術(shù)與技術(shù)開發(fā)的融合,累計客戶超過千家,服務(wù)滿意度達97%。幫助廣大客戶順利對接上互聯(lián)網(wǎng)浪潮,準(zhǔn)確優(yōu)選出符合自己需要的互聯(lián)網(wǎng)運用,我們將一直專注成都品牌網(wǎng)站建設(shè)和互聯(lián)網(wǎng)程序開發(fā),在前進的路上,與客戶一起成長!

本人以一只飛行的鳥為例

先看Flash , 如下

flash的項目名稱為 fly.fla

Egret之MC逐幀動畫

舞臺幀信息 , A 和 B為幀標(biāo)簽

Egret之MC逐幀動畫

打開texture merger , 選擇egret movieclip 。將fly.swf拖入到編輯區(qū) , 取名Bird , 如下:

Egret之MC逐幀動畫

導(dǎo)出動畫文件 , json 和 png圖集

Egret之MC逐幀動畫

為導(dǎo)出文件取名:

Egret之MC逐幀動畫

我們看看mc_test.json文件如下:

{"mc":{
 "fly":{
  "frameRate":24,
  "labels":[
   {"name":"A","frame":1,"end":3}
   ,{"name":"B","frame":4,"end":8}
   
   ],
  "events":[
   
   ],
  "frames":[
   
   {
   "res":"3E7A5975",
   "x":-67,
   "y":-24
   },
   {
   "res":"521E77D1",
   "x":-67,
   "y":-21
   },
   {
   "res":"4A0EE357",
   "x":-73,
   "y":-24
   },
   {
   "res":"34630D9E",
   "x":-71,
   "y":-36
   },
   {
   "res":"175B90A8",
   "x":-74,
   "y":-29
   },
   {
   "res":"4BC2B418",
   "x":-74,
   "y":-44
   },
   {
   "res":"A49D29C2",
   "x":-76,
   "y":-40
   },
   {
   "res":"B1A21F34",
   "x":-73,
   "y":-19
   }
   ]
}},
 "res":{
  "34630D9E":{"x":1,"y":1,"w":136,"h":77},
  "521E77D1":{"x":280,"y":62,"w":122,"h":61},
  "3E7A5975":{"x":142,"y":121,"w":123,"h":56},
  "4A0EE357":{"x":139,"y":1,"w":136,"h":59},
  "175B90A8":{"x":139,"y":62,"w":139,"h":57},
  "B1A21F34":{"x":267,"y":125,"w":139,"h":41},
  "A49D29C2":{"x":1,"y":121,"w":139,"h":53},
  "4BC2B418":{"x":277,"y":1,"w":136,"h":59}
 }}

解釋如下:

Egret之MC逐幀動畫

在項目中實現(xiàn)此MC的播放

核心代碼:

  protected childrenCreated():void{
   super.childrenCreated();
   this.txt_name.text = "Snow";
   this.img_dragon.source = RES.getRes("egret_icon_png");
   //this.playDragonEff();
            this.ayncLoad2Mc("mc_test_json");
  }
        private ayncLoad2Mc( resname : string) : void{
            var self = this;
            RES.getResAsync(resname,
                function(data: any,key: string): void {
                    if(key == "mc_test_json") {
                        self.ayncLoad2Mc("mc_test_png");
                    }
                    else if(key == "mc_test_png") {
                        this.playMC();
                    }
                },
                this);
        }
        private playMC() : void{
            var data2mc = RES.getRes("mc_test_json");
            var texture2mc = RES.getRes("mc_test_png");
            let mcFactory : egret.MovieClipDataFactory = new egret.MovieClipDataFactory(data2mc,texture2mc);
            let mc:egret.MovieClip = new egret.MovieClip(mcFactory.generateMovieClipData("fly"));
            mc.gotoAndPlay("A",-1);//"A" : 標(biāo)簽 -1 : 循環(huán)播放
            this.addChild(mc);
            mc.x = 200;
            mc.y = 400;
        }

結(jié)果:

Egret之MC逐幀動畫

解釋:

Egret之MC逐幀動畫

幀事件標(biāo)簽

mc.addEventListener(egret.MovieClipEvent.FRAME_LABEL,(e:egret.MovieClipEvent)=>{   console.log(e.type,e.frameLabel,mc.currentFrame);},this);

如 :

{"mc":{
	"Battle_start":{
		"frameRate":12,
		"labels":[
			
			],
		"events":[
			 {"name":"@enemy","frame":8}
			],
		"frames":[

那么 : e.frameLabel == "@enemy"


注意 : {"name":"@enemy","frame":8}可以手寫加上



每一輪循環(huán)播放完畢觸發(fā)

mc.addEventListener(egret.Event.LOOP_COMPLETE, (e:egret.Event)=>{   console.log(e.type);}, this);

完全播放完畢觸發(fā)

mc.addEventListener(egret.Event.COMPLETE, (e:egret.Event)=>{   console.log(e.type);}, this);

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

分享題目:Egret之MC逐幀動畫-創(chuàng)新互聯(lián)
本文地址:http://bm7419.com/article18/ihggp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站策劃手機網(wǎng)站建設(shè)、外貿(mào)建站、商城網(wǎng)站營銷型網(wǎng)站建設(shè)、網(wǎng)站改版

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

小程序開發(fā)