2048小遊戲設計思路

YQEMMMM發表於2020-10-26

2048小遊戲設計思路:
設計思路
遊戲初始截圖:
在這裡插入圖片描述
遊戲過程中截圖:
在這裡插入圖片描述
遊戲失敗截圖:
在這裡插入圖片描述
部分程式碼:

<!DOCTYPE html>

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>2048小遊戲</title>
<script type="text/javascript">

function showBestScore(){
	//從本地儲存資料中讀取歷史最高分
    bestScore = localStorage.getItem("bestScore");
     //如果尚未記錄最高分,則重置為0
    if (bestScore == null)
        bestScore = 0;
    //將歷史最高分更新到狀態列中
    var best = document.getElementById("bestScore");
    best.innerHTML = bestScore;
}

var arr;
//初始化遊戲頁面,需要在表格中隨機生成一個2,一個4
function init(){
	showBestScore();
    arr = new Array(4);
    for(i=0;i<arr.length;i++){
        arr[i]=[0,0,0,0];
    }
    var x1,x2,y1,y2;
    x1=Math.round(Math.random()*3);
    y1=Math.round(Math.random()*3);
    arr[x1][y1] =2;
    while(true){
        x2=Math.round(Math.random()*3);
        y2=Math.round(Math.random()*3);
        if(x1!=x2 || y1!=y2){
            arr[x2][y2] =4;
            break;
        }
    }
    display();
    show();

}

備註:檢視網頁2048遊戲程式碼請下載附件

相關文章