堆疊與佇列
堆疊 (Stack)
- 加入(push)與刪除(pop)於同一端
- 具有後進先出(LIFO, Last-in-First-out)或先進後出(FILO, First-in-Last-out)性質的有序串列
- 例子：疊盤子、發牌、走迷宮
佇列 (Queue)
- 加入(enqueue)與刪除(dequeue)於不同端(front & rear)
- 先進先出(FIFO, First-in-First-out)
- 例子：排隊買票、坐公車
實作復原功能
復原功能比較像是走迷宮，一定是先從最後一步開始復原，因此這邊我們採用堆疊的方式。堆疊最簡單的實作方式就是使用array，並用pop以及push來塞入、取出資料。
首先先創建一個類別名為RevertBtn.ts
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
import { ButtonBase } from "./ButtonBase"; import { eventEmitter } from "../Main"; import { GameFlowEvent } from "../core/Event"; export class RevertBtn extends ButtonBase { constructor() { super('Button','Revert',50,345); } public trigger(){ eventEmitter.emit(GameFlowEvent.RevertBackRequest); } } |
接著在GameScene.ts加入RevertBtn這個按鈕
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
export class GameScene { public static draw(){ //加入背景 application.stage.addChild(PIXI.Sprite.from(Loader.resources["background"].texture)); //加入按鈕 application.stage.addChild(new SoundBtn()); application.stage.addChild(new RevertBtn()); //加入連連看牌面 application.stage.addChild(new GameBoard()); application.stage.addChild(LinkedLine.instance); //角色動畫 application.stage.addChild(new Character()); } } |
然後去GameBoard.ts註冊GameFlowEvent.RevertBackRequest這個事件
|
1 2 3 4 5 6 7 8 |
constructor() { super(); this.createNewGame(); this.x = 175; this.y = 20; eventEmitter.on(GameFlowEvent.RevertBackRequest,this.revertBoard.bind(this)); } |
並新增revertBoard的方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
revertBoard = ()=>{ let value = this.valueHistory.pop(); let path = this.pathHistory.pop(); if(value != null && path != null){ board.board[path.point1.x][path.point1.y] = value; board.board[path.point2.x][path.point2.y] = value; this.drawBoardIcon(); SoundMgr.play('Back'); } }ack'); } } |
然後在每次成功連線時，將成功連線的方塊的值和位置存進陣列裡
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
createIcon = (id, x, y)=>{ let icon = new GameIcon(id,x,y); this.addChild(icon); let iconClickHandler = ()=>{ if (this.selected) { let selectCorrect = false; this.select2 = new Point(x, y); this.iconSelected(this.select2); setTimeout(()=>{ if (board.hasSameValue(this.select1, this.select2)) { if (! (this.select1.x == x && this.select1.y == y) ) { let path = new Path(this.select1, this.select2, board); if(path.canLinkInLine()){ this.pathHistory.push(path);//存入選擇的點 this.valueHistory.push(board.getValue(this.select1));//存入消掉的符號id LinkedLine.instance.drawPath(path); this.clearIcon(this.select1); this.clearIcon(this.select2); eventEmitter.emit(GameFlowEvent.LinkedLineSuccess); selectCorrect = true; //判斷還有沒有路走 if(board.gameRoundEnd()){ alert("恭喜完成遊戲!"); this.createNewGame(); }else if(board.getFirstExistPath() == null){ this.reloadTimes--; board.rearrangeBoard(); } } } } if(selectCorrect){ SoundMgr.play('Sound_select_crrect'); }else{ SoundMgr.play('Sound_select_error'); this.iconUnSelected(this.select1); this.iconUnSelected(this.select2); } this.selected = false; },0); } else { this.select1 = new Point(x, y); this.iconSelected(this.select1); this.selected = true; SoundMgr.play('Sound_select_1'); } }; icon.on("click", iconClickHandler); icon.on("tap", iconClickHandler); } |
今日成果
線上展示：http://claire-chang.com/ironman2018/1107
今日成果下載： ironman20181107