欢迎来到天天文库
浏览记录
ID:14108545
大小:44.00 KB
页数:21页
时间:2018-07-26
《用html制作一个简单桌球游戏教程》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库。
1、★精品文档★用HTML5制作一个简单桌球游戏教程 这篇文章主要介绍了用HTML5制作一个简单的桌球游戏的教程,主要利用到了HTML5的CanvasAPI,需要的朋友可以参考下话说这只是一个简单的DEMO。游戏性,游戏规则什么的我都没怎么考虑,如果有兴趣细化的朋友可以细化一下,比如细化一下规则,游戏开关,加个声音,细化一下进球检测,更严谨甚至可以去查下击球力度、桌面真实摩擦力等来把游戏弄的更像游戏。我只是给个编程思路哈,随便坐个DEMO而已,玩起来估计还是不会很爽快的~~整个桌球游戏就两个类,一个是球,一个是辅助瞄准线。如果想把改游戏弄的更复杂,还可以再抽象一个形状类
2、,用于检测球与边角的碰撞以及进球。我做的这个游戏采取了最简单的墙壁碰撞检测,所以没有进行球与不规则形状的碰撞检测,如果想玩更复杂的碰撞,可以戳关于简单的碰撞检测岑安大大讲的还是很好的。好,接下来就一步一步来:【球】代码如下: [/code]varBall=function(x,y,ismine){ this.x=x; 2016全新精品资料-全新公文范文-全程指导写作–独家原创21/21★精品文档★this.y=y; &
3、nbsp; this.ismine=ismine; this.oldx=x; this.oldy=y; this.vx=0; this.vy=0; this.radius=bal
4、lRadius; this.inhole=false;this.moving=true; } Ball.prototype={ constructor:Ball, _paint:function(){
5、 2016全新精品资料-全新公文范文-全程指导写作–独家原创21/21★精品文档★ varb=this.ismine?document.getElementById(“wb”):document.getElementById(“yb”) if(b.complete){ ctx.drawImage(b,this.x-this.radius,t
6、his.y-this.radius,2*this.radius,2*this.radius); } else{ b.onload=function(){ &nbs
7、p; ctx.drawImage(b,this.x-this.radius,this.y-this.radius,2*this.radius,2*this.radius); } 2016全新精品资料-全新公文范文-全程指导写作–独家原创21/21★精品文档★ } &
此文档下载收益归作者所有