手摸手帶你實現 小遊戲<別踩白塊兒 -- 內有遊戲連結>
摘要：
遊戲地址
準備工作
瞭解白鷺引擎 並安裝編寫工具
安裝遊戲引擎
安裝Egret Wing3
建立專案
建立專案可以選擇不同版本的引擎，建立成功之後還可以檢視A...
ofollow,noindex">遊戲地址
準備工作
- 瞭解白鷺引擎 並安裝編寫工具
- 安裝遊戲引擎
- 安裝Egret Wing3
- 建立專案
建立專案可以選擇不同版本的引擎，建立成功之後還可以檢視API，對釋出進行設定。 目錄結構如下
）
程式碼編寫
先說一下整體的思路： 就是將整個遊戲細分一下，一個小格子為一個模組，然後每一列為一個大的模組，遊戲整體作為一個大的模組，定時器作為一個模組，開始遊戲和結束遊戲分別作為一個模組。如圖：
-
廢話少說 開擼開擼
-
egret提供server服務
egret startserver -a-a 表示對檔案進行監控自動更新
BoxGraphics
// 負責初始化小格子
private init() {
this.touchEnabled = true;
this.width = GameData.getBoxWidth();
this.height = GameData.getBoxHeight();
this.addEventListener(egret.TouchEvent.TOUCH_BEGIN, this.click, this);
}
/**
* drawBox
* 繪製內容
*/
public drawBox(canTouch:boolean=false) {
this._canTouch = canTouch;
this.graphics.clear();
if(canTouch) {
this.graphics.beginFill(0);
} else {
this.graphics.beginFill(0xffffff);
}
this.graphics.lineStyle(1, 0);
this.graphics.drawRect(0,0,GameData.getBoxWidth(),GameData.getBoxHeight());
this.graphics.endFill();
}
/**
* click
* 當前方塊被點選後的響應事件
*/
private click(evt:egret.TouchEvent):void {
this.graphics.clear();
if(this._canTouch) {
this.graphics.beginFill(0xcccccc);
} else {
this.graphics.beginFill(0xff0000);
}
this.graphics.lineStyle(1, 0);
this.graphics.drawRect(0,0,GameData.getBoxWidth(),GameData.getBoxHeight());
this.graphics.endFill();
var event:GameEvent;
//不能點選，丟擲錯誤事件
if(!this._canTouch) {
event = new GameEvent(GameEvent.GAME_OVER);
} else {
event = new GameEvent(GameEvent.GAME_HIT);
}
this.dispatchEvent(event);
}
複製程式碼
GroupRect
- 一行格子
private init():void {
this._boxs = [];
// 生成一行中的每一個格子 並給每個格子新增對應事件
for(var i:number=0;i<GameData.column;i++) {
var box:BoxGraphics = new BoxGraphics();
this._boxs.push(box);
box.addEventListener(GameEvent.GAME_HIT, this.clickRight, this);
box.addEventListener(GameEvent.GAME_OVER, this.boxGameOver, this);
this.addChild(box);
box.x = GameData.getBoxWidth()*i;
}
}
複製程式碼
GameView
- 遊戲主介面
private init():void {
this._boxGroups = [];
var len:number = GameData.row+1;
// 迴圈生成每一列格子
for(var i:number=0;i<len;i++) {
var boxg:GroupRect = new GroupRect();
this._boxGroups.push(boxg);
this.addChild(boxg);
boxg.addEventListener(GameEvent.GAME_OVER, this.gameOver, this);
boxg.addEventListener(GameEvent.GAME_HIT, this.clickRight, this);
}
/*
this.scoreText = new egret.TextField();
this.scoreText.textColor = 0xff0000;
this.scoreText.bold = true;
this.scoreText.size = 100;
*/
// 設定 分數
this.scoreText = new egret.BitmapText();
this.scoreText.x = 180;
this.scoreText.y = 50;
this.scoreText.text = String(0);
this.addChild(this.scoreText);
}
複製程式碼
- 點選遊戲移動函式
public move() {
var len:number = GameData.row+1;
for(var i:number=0;i<len;i++) {
// 遊戲加速
this._boxGroups[i].y += GameData.speed;
//移動到舞臺外側了
if(this._boxGroups[i].y>=GameData.getStageHeight()){
// 如果格子沒有被點選 遊戲結束
if(!this._boxGroups[i].isHit) {
this.gameOver();
return;
}
// 設定對應格子的位置
if(i==0) {
this._boxGroups[i].y = this._boxGroups[4].y - GameData.getBoxHeight();
} else {
this._boxGroups[i].y = this._boxGroups[i-1].y - GameData.getBoxHeight();
}
this._boxGroups[i].create();
}
}
}
複製程式碼
Main
- 入口檔案
/**
* 初始化遊戲函式
* 初始化gameview
* 初始化定時器
* 初始化開始|結束 畫布
* 新增事件監聽
*/
private init():void {
this.gameview = new GameView();
this.addChild(this.gameview);
this.gameview.addEventListener(GameEvent.GAME_OVER, this.gameover,this);
this.timer = new egret.Timer(20,0);
this.timer.addEventListener(egret.TimerEvent.TIMER, this.timers, this);
this.gameoverPanel = new GameOverPanel();
this.gameoverPanel.addEventListener(GameEvent.GAME_START,this.startgame,this);
this.startgamePanel = new StartGamePanel();
this.startgamePanel.addEventListener(GameEvent.GAME_START, this.startgame, this);
this.addChild(this.startgamePanel);
}
//定義事件
/**
* 遊戲結束
*/
private gameover(evt:GameEvent):void {
this.timer.stop();
this.gameoverPanel.update();
this.addChild(this.gameoverPanel);
}
/**
* 開始遊戲
* 重新設定遊戲速度 分數
* 去除遊戲開始|結束畫布
*/
private startgame(evt:GameEvent):void {
GameData.speed = 10;
GameData.setScore(0);
this.gameview.startgame();
if(this.startgamePanel.parent) {
this.removeChild(this.startgamePanel);
}
if(this.gameoverPanel.parent) {
this.removeChild(this.gameoverPanel);
}
this.timer.start();
}
複製程式碼
釋出
egret publish