公司項目有用到egret h5小程序，所以就抽空研究了下小游戲的開發

首先還是要感謝egret論壇的熱心網友，游戲的素材也是來自egret論壇，代碼邏輯是自己寫的

【第一步：UI界面】

游戲界面如下：

左側是控制欄，右側框內是游戲區域。右側區域可以做自適應手機屏幕。

【第二步：程序結構】

上述圖片兩個紅框內，ts部分是程序代碼部分，resource就是游戲對應的所需要的素材

程序部分大致介紹下：

ui包里，就是游戲的具體的邏輯控制

Control：是左側控制欄的

Snake：是貪吃蛇的一個方塊

SnakeEngine：是貪吃蛇的游戲邏輯

Main：是程序的主入口，資源配置和游戲的啟動

StartGame:是游戲的入口

【第三步：部分代碼】

Main.ts

可以保留官方的程序，加入這個游戲啟動程序就可以

PRivate createGameScene():void{        this.addChild(new StartGame());}
StartGame.ts
/** * * @author libins * */class StartGame extends egret.DisplayObjectContainer{    private boxDisX:number = 20;    private snakeSize:number = 15;    private stageW:number;    private stageH:number;    private controlSp:Control;    private box      :egret.Sprite;    private snakeEngine: SnakeEngine;    	public constructor() {    	super();    	this.addEventListener(egret.Event.ADDED_TO_STAGE,this.addToStage,this);	}		private addToStage(e:egret.Event):void{    	  this.removeEventListener(egret.Event.ADDED_TO_STAGE,this.addToStage,this);    	  this.stageW = this.stage.stageWidth;    	  this.stageH = this.stage.stageHeight;	    this.createBg();	    this.createControl();	    this.drawRect();        this.startSnakeEngine();	}		private createBg():void{	     var bg:egret.Shape = new egret.Shape();	     bg.graphics.beginFill(0xffff00);         bg.graphics.drawRect(0,0,this.stageW ,this.stageH);         bg.graphics.endFill();         this.addChild(bg);	}	    private createControl():void{        this.controlSp = new Control();        this.controlSp.addEventListener("重新開始",this.playAgain,this);        this.controlSp.addEventListener("改變方向",this.changMove,this);        this.addChild(this.controlSp);    }        private playAgain(e:egret.Event):void{        this.snakeEngine.playAgain();    }        private drawRect():void{        this.box = new egret.Sprite();        this.box.graphics.lineStyle(2,0x000000);        this.box.graphics.beginFill(0xffffff);        var boxWidth: number  = this.stageW - this.controlSp.width - this.boxDisX * 2;        var boxHeight: number = this.stageH - this.boxDisX * 2;        var shouldWidth: number = Math.floor(boxWidth / this.snakeSize) * this.snakeSize;        var shouldHeight:number = Math.floor(boxHeight/this.snakeSize)*this.snakeSize;        this.box.graphics.drawRect(0,0,shouldWidth,shouldHeight);        this.box.graphics.endFill();        this.box.x = this.controlSp.width+this.boxDisX;        this.box.y = this.boxDisX;        this.addChild(this.box);    }        private startSnakeEngine():void{        this.snakeEngine = new SnakeEngine();        this.box.addChild(this.snakeEngine);    }        private changMove(e:egret.Event):void{        this.snakeEngine.changeMove(this.controlSp.getMoveType());    }}上述代碼復雜一點的就在drawRect里，里面主要是要做自適應屏幕寬度，畫一個可以整數倍添加蛇體寬度的一個方框。
SnakeEngine.ts
/**	 *	 * @author libins 	 *	 */class SnakeEngine extends egret.DisplayObjectContainer {    private snakeTotal:number;    private snakeArr  : eui.ArrayCollection;    private apple     :egret.Bitmap;    private myTimer   :egret.Timer;    private moveType  :string;    private moveXBol  :Boolean;    private moveSpeed: number = 15;    private timeCount :number = 100;    private parentW   :number;    private parentH   :number;    private snakeLiveBol:Boolean;        public constructor() {        super();        this.addEventListener(egret.Event.ADDED_TO_STAGE,this.addToStage,this);	}		private addToStage(e:egret.Event):void{        this.removeEventListener(egret.Event.ADDED_TO_STAGE,this.addToStage,this);        this.parentW = this.parent.width;        this.parentH = this.parent.height;        this.playAgain();	}		private initTimer():void{        this.myTimer = new egret.Timer(this.timeCount,0);        this.myTimer.addEventListener(egret.TimerEvent.TIMER,this.move,this);        this.myTimer.start();	}		public playAgain():void{        this.snakeTotal = 0;        this.snakeLiveBol = true;        this.snakeArr   = new eui.ArrayCollection();        this.removeAll();        this.initUI();	}		public changeMove($type:string):void{        if(this.myTimer == undefined){            this.initTimer();        }else{            if(!this.myTimer.running) {                this.myTimer.start();            }        }        if(this.moveXBol!=undefined){            if(this.moveXBol && ($type == "right" || $type == "left")) return;            if(!this.moveXBol && ($type == "up" || $type == "down")) return;        }        this.moveType = $type;	}		private removeAll():void{	    while(this.numChildren>0){	        this.removeChildAt(0);	    }	    if(this.myTimer!=undefined){            this.myTimer.stop();	    }        this.moveXBol = undefined;	}		private initUI():void{        this.addSnake();        var snakeItem:egret.Bitmap = this.getChildAt(0) as egret.Bitmap;        this.setRamdonPostion(snakeItem);         this.addApple();	}		private addApple():void{        this.apple = new egret.Bitmap(RES.getRes("apple_png"));        this.addChild(this.apple);        this.setRamdonPostion(this.apple); 	}		private removeApple():void{	    this.removeChild(this.apple);	    this.apple = null;	}		private setRamdonPostion($target:egret.DisplayObject):void{        var couldWNum: number = this.parent.width / $target.width;        var couldHNum: number = this.parent.height / $target.height;        $target.x = Math.floor(Math.random() * (couldWNum-1)) * $target.width;        $target.y = Math.floor(Math.random() * (couldHNum-1)) * $target.height; 	}		private addSnake():void{        var snakeItem = new Snake();        this.addChild(snakeItem);        this.snakeArr.addItem(snakeItem);        this.snakeTotal++;	}		private move(e:egret.TimerEvent):void{        if(this.snakeLiveBol == false) return;        for(var i: number = 0;i < this.snakeTotal;i++) {            var snakeItem: Snake = this.snakeArr.getItemAt(i) as Snake;            snakeItem.lastPoint = new egret.Point(snakeItem.x,snakeItem.y);            if(i == 0) {                 switch(this.moveType) {                    case "up":                        snakeItem.y -= this.moveSpeed;                        if(snakeItem.y<0){                            //snakeItem.y = this.parent.height - snakeItem.height;                            snakeItem.y = 0;                            this.gameOver();                        }                        this.moveXBol = false;                        break;                    case "down":                        snakeItem.y += this.moveSpeed;                        if(snakeItem.y >= this.parentH - this.moveSpeed) {                            //snakeItem.y = 0;                            snakeItem.y = this.parentH - this.moveSpeed;                            this.gameOver();                        }                        this.moveXBol = false;                        break;                    case "left":                        snakeItem.x -= this.moveSpeed;                        if(snakeItem.x < 0) {                           // snakeItem.x = this.parent.width - snakeItem.width;                            snakeItem.x  = 0;                            this.gameOver();                        }                        this.moveXBol = true;                        break;                    case "right":                        snakeItem.x += this.moveSpeed;                        if(snakeItem.x >= this.parentW - this.moveSpeed) {                            //snakeItem.x = 0;                            snakeItem.x = this.parentW - this.moveSpeed;                            this.gameOver();                        }                        this.moveXBol = true;                        break;                }                var p1: egret.Point = new egret.Point(snakeItem.x,snakeItem.y);                var p2: egret.Point = new egret.Point(this.apple.x,this.apple.y);                if(egret.Point.distance(p1,p2) < this.moveSpeed*.5){                    this.removeApple();                    this.addApple();                    this.addSnake();                }            }else{                var lastSnakeItem: Snake = this.snakeArr.getItemAt(i - 1) as Snake;                snakeItem.x = lastSnakeItem.lastPoint.x;                snakeItem.y = lastSnakeItem.lastPoint.y;                var p3: egret.Point = new egret.Point(snakeItem.x,snakeItem.y);                if(egret.Point.distance(p1,p3) < this.moveSpeed) {                    this.gameOver();                }            }        }	}		private gameOver():void{        this.myTimer.stop();        this.snakeLiveBol = false;	}}這個是貪吃蛇的游戲的關鍵代碼，就是時間驅動，蛇頭移動，然后就是判斷是否吃到蘋果，移動那，保證了只能90度方向調整，添加的蛇體部分，是以火車車廂的概念，連接在一起
另外兩個類，就是純UI的資源加載和點擊事件，不放上來了。
個人覺得Egret做游戲開發還是挺方便的，開發者只要把精力放在游戲邏輯上，其他的資源，瀏覽器兼容等都交給Egret負責搞定，上手容易。