docker/pacman
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

参数更新和绘制分离

Browse Source
This commit is contained in:
郑浩乐 2016-01-01 08:00:04 +08:00
parent cfc1f7498d
commit 5f1157664d
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
game.js
View File

@ -36,7 +36,8 @@ function Game(id,options){
y:0 y:0
}, },
speed:1, //速度等级,内部计算器times多少帧变化一次 speed:1, //速度等级,内部计算器times多少帧变化一次
update:function(){} //更新参数信息 update:function(){}, //更新参数信息
draw:function(){} //绘制
}; };
for(var i in settings){ for(var i in settings){
this[i] = options[i]||settings[i]; this[i] = options[i]||settings[i];
@ -89,9 +90,10 @@ function Game(id,options){
f++; f++;
stage.items.forEach(function(item,index){ stage.items.forEach(function(item,index){
if(!(f%item.speed)){ if(!(f%item.speed)){
item.times = f/item.speed; //计数器 item.frames = f/item.speed; //计数器
} }
item.update(_context); item.update();
item.draw(_context);
}); });
_hander = requestAnimationFrame(fn); _hander = requestAnimationFrame(fn);
} }

8
index.js
View File

@ -19,10 +19,10 @@
width:100, width:100,
height:100, height:100,
speed:10, speed:10,
update:function(context){ draw:function(context){
context.fillStyle = '#FC3'; context.fillStyle = '#FC3';
context.beginPath(); context.beginPath();
if(this.times%2){ if(this.frames%2){
context.arc(this.x,this.y,this.width/2,.20*Math.PI,1.80*Math.PI,false); context.arc(this.x,this.y,this.width/2,.20*Math.PI,1.80*Math.PI,false);
}else{ }else{
context.arc(this.x,this.y,this.width/2,.01*Math.PI,1.99*Math.PI,false); context.arc(this.x,this.y,this.width/2,.01*Math.PI,1.99*Math.PI,false);
@ -41,7 +41,7 @@
stage.createItem({ stage.createItem({
x:game.width/2, x:game.width/2,
y:game.height*.6, y:game.height*.6,
update:function(context){ draw:function(context){
context.font = 'bold 42px Helvetica'; context.font = 'bold 42px Helvetica';
context.textAlign = 'center'; context.textAlign = 'center';
context.textBaseline = 'middle'; context.textBaseline = 'middle';
@ -53,7 +53,7 @@
stage.createItem({ stage.createItem({
x:game.width-12, x:game.width-12,
y:game.height-5, y:game.height-5,
update:function(context){ draw:function(context){
context.font = '14px Helvetica'; context.font = '14px Helvetica';
context.textAlign = 'right'; context.textAlign = 'right';
context.textBaseline = 'bottom'; context.textBaseline = 'bottom';