Da das gesamte Spiel in einer Spielschleife stattfindet, kann man sagen, dass die Spielschleife der Kernbestandteil des Spiels ist. Jedes Mal, wenn die Schleife durchlaufen wird, werden die Eigenschaften des Spielobjekts aktualisiert und die Spielelemente werden gezeichnet.
Wie im vorherigen Artikel zum Laden von Ressourcen erwähnt, wird beim Starten des Spiels eine Spielschleife gestartet:
/** *图像加载完毕的处理程序 **/ var imgLoad=function(self){ return function(){ self.loadedCount+=1; self.loadedImgs[this.srcPath]=this; this.onLoad=null; //保证图片的onLoad执行一次后销毁 self.loadedPercent=Math.floor(self.loadedCount/self.sum*100); self.onLoad&&self.onLoad(self.loadedPercent); if(self.loadedPercent===100){ self.loadedCount=0; self.loadedPercent=0; loadingImgs={}; if(self.gameObj&&self.gameObj.initialize){ self.gameObj.initialize(); if(cg.loop&&!cg.loop.stop){//结束上一个循环 cg.loop.end(); } cg.loop=new cg.GameLoop(self.gameObj);//开始新游戏循环 cg.loop.start(); } } } }
Rufen Sie nach dem Laden der Bildressourcen die Initialisierungsmethode des Spielobjekts auf und ermitteln Sie, ob das Spielschleifenobjekt vorhanden ist. Beenden Sie die vorherige Schleife (diese Situation tritt normalerweise auf, wenn Sie Ebenen wechseln und neue Spielobjekte übergeben). ). Ansonsten wird die Spielschleife aufgebaut und gestartet.
OK, schauen wir uns nun den Implementierungscode der Spielschleife an:
var gameLoop=function(gameObj,options){ if(!(this instanceof arguments.callee)){ return new arguments.callee(gameObj,options); } this.init(gameObj,options); }
Zunächst muss die Spielschleifen--Funktion auch dafür sorgen, dass dies der Fall ist basiert auf dem Konstruktor<. Wird in der Form 🎜> aufgerufen. Initialisieren Sie nach dem Aufruf das Objekt:
/** *初始化 **/ init:function(gameObj,options){ /** *默认对象 **/ var defaultObj={ fps:30 }; options=options||{}; options=cg.core.extend(defaultObj,options); this.gameObj=gameObj; this.fps=options.fps; interval=1000/this.fps; this.pause=false; this.stop=true; },
Darüber hinaus unterstützt die Schleife zwei Modi: Pause und Stopp.
/** *开始循环 **/ start:function(){ if(this.stop){ //如果是结束状态则可以开始 this.stop=false; this.now=new Date().getTime(); this.startTime=new Date().getTime(); this.duration=0; loop.call(this)(); } },
var timeId; var interval; /** *循环方法 **/ var loop=function(){ var self=this; return function(){ if(!self.pause&&!self.stop){ self.now=new Date().getTime(); self.duration=self.startTime-self.now; if(self.gameObj.update){ self.gameObj.update(); } if(self.gameObj.draw){ cg.context.clearRect(0,0,cg.width,cg.height); self.gameObj.draw(); } } timeId=window.setTimeout(arguments.callee,interval); } }
rekursivauf, um sich selbst aufzurufen und eine Schleife zu implementieren.
Gesamter Quellcode der Spielschleife:Das obige ist der detaillierte Inhalt vonHTML5-Spielframework cnGameJS-Entwicklungsaufzeichnung-Spielschleife. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!