Feb 7

一個可拓展JS貪吃蛇框架

Lrdcq , 2015/02/07 01:38 , 程序 , 閱讀(2249) , Via 本站原創
之前給社團的小盆友展示貪吃蛇的做法,自己也做了一個高拓展性的360度貪吃蛇框架
此處稍微記錄一下這個貪吃蛇框架構建理念。
【demo地址:http://lrdcq.com/test/snake.html

看源碼,那個snake.js就是我們的核心代碼了
裏面包含幾個類、
S.Snake 蛇類
S.Item 物品類
S.Face UI類
S.Buff buff類,內部使用
還有M命名域的數學函數與E命名域的運行環境

整個遊戲的初始化與運行是E中的函數組織起來的
基本上使用方法如下
E.clear();
//清空環境,習慣用法
E.facelist.push(new S.Face('time','#f0f',48,'margin:auto;left:0;right:0;top:30px;width:120px;',
  function(f){
    var s=(' '+E.timer/10);
    return (s.indexOf('.')<0?s+'.0':s)+'s';
  }
,0,$('interface')));
//聲明UI的方法,用刷新響應事件來更新數據
E.itemlist.push(new S.Item('果','#0f0',18,0,0,//聲明一個水果
  function(c,i,s){
    s.game_up();//聲明數上升
    s.buff.add('speed',0.9,3);//增加buff,速度
    c.del(i);//刪除這個物品(不刪除的話可以做墻之內的東西)
    E.itemlist[0].add([Math.random()*E.stage[0],Math.random()*E.stage[1]]);//放置一個新的水果
  }
,$('item1')));
//聲明物品的方法,也是囘調函數來處理吃掉物品后的方法
for(var i=0;i<4;i++){
  E.itemlist[0].add([Math.random()*E.stage[0],Math.random()*E.stage[1]]);
}//在舞臺上隨機放置4個水果
E.snakelist.push(new S.Snake(16,[300,300],[0,-10],5,'#f00',$('snake1')));//添加一條蛇
E.timer=1200;//設置時間倒計時
E.start();//遊戲開始

這是參考代碼,demo裏面有更複雜的函數調用,無非也就是這麼幾個函數構成的舞臺。

似乎可以做出很有意思的貪吃蛇設定哦grin

另外求貪吃蛇AI編寫love
logo