一篇文章带你制作 canvas 小游戏 (3-完结)

最新推荐文章于 2022-12-31 13:44:50 发布

旺旺不太忘

最新推荐文章于 2022-12-31 13:44:50 发布

阅读量403

点赞数 1

分类专栏： canvas 面向对象

本文链接：https://blog.csdn.net/qq_38214179/article/details/70194943

版权

下面直接上飞鸟游戏代码:

非常简单的休闲游戏!代码写的马马虎虎,本篇是还未封装的,不够简洁,清晰,凑合看吧;

这是纯面向过程写的(生成管道时有个坑),在面向对象方式中已经解决了,我就不上传了;

游戏我已经上传到自己github静态服务器上面了;

想去玩一玩的可以登录 https://mrwrq.github.io/birds玩一玩哈,一个非常简单休闲的游戏!

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script type="text/javascript">
		//封装图片加载
		onLoadImg=function(imgSrc,callback){
			var listImg={},
			content=0,
			imgLen=imgSrc.length;
			//给图片添加路径
			imgSrc.forEach(function(val,index){
				var img = new Image();
				img.src='images/'+val+'.png';
				listImg[val]=img;
				img.οnlοad=function(){
					content++;
					//全部加载完成调用回调函数
					if(content>=imgLen){
						callback(listImg);
					};
				};
			});
		};

		//角度转化
		toRadian=function(angle) {
			return angle/180*Math.PI;
		};

		//创建游戏画布
		var cv = document.createElement('canvas');
		document.getElementsByTagName('body')[0].appendChild(cv);
		cv.width='800';
		cv.height='600';
		cv.style.border='1px solid red';
		var ctx=cv.getContext("2d");

		//声明游戏系统变量
		var a = 0.0005, // 加

最低0.47元/天解锁文章

旺旺不太忘

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
1
评论
一篇文章带你制作 canvas 小游戏 (3-完结)

下面直接上飞鸟游戏代码:非常简单的休闲游戏!代码写的马马虎虎,本篇是还未封装的,不够简洁,清晰,凑合看吧;这是纯面向过程写的(生成管道时有个坑),在面向对象方式中已经解决了,我就不上传了;游戏我已经上传到自己github静态服务器上面了;想去玩一玩的可以登录 https://mrwrq.github.io/birds玩一玩哈,一个非常简单休闲的游戏! Document
复制链接

扫一扫