我的第一个HBuider项目 ——五子棋
来源:互联网 发布:线性代数中矩阵求模 编辑:程序博客网 时间:2024/06/01 11:16
HBuider是实训老师建议我们使用的,写起代码来感觉很流畅,自动缩进与纠错功能都很不错。之所以做五子棋,也是因为五子棋是一个比较简单的游戏。
HBuider上手容易,主要是编写代码有点头大,还好在我的穷追猛打下跟上了老师的节奏,成功完成了我的第一个HBuider项目。虽然并不是自己独立完成的,但代码都是自己一个一个敲出来的。我相信在之后的学习生涯中我能学习到更多的知识,更熟练的运用HBuider。
下面我贴上自己的劳动成果
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<canvas id="myCanvas" width="570" height="570" style="border: 2px solid #abcabc;"></canvas>
<!--
作者:1044723728@qq.com
时间:2017-07-03
描述:
-->
<script>
//获取canvas的标签
var ChessCanvas = document.getElementById("myCanvas");
//获取画布
var gameCanvas = ChessCanvas.getContext("2d");
//定义棋盘大小
var map = 25;
//棋子大小
var chessSize = 18;
//下棋的坐标
var x=y=0;
//棋子颜色
var isRed = true;
var color = "#000000";
//棋子数组 二维
//用于保存所下的棋子 0:未下 1:下的是红旗 2:下黑棋
var chessDate = new Array(23);
for(var i=0;i<23;i++)
{
chessDate[i] = new Array(23);
for(var j=0;j<23;j++)
{
chessDate[i][j] = 0;
}
}
//所下棋子在棋子数组的位置
var i,j;
//绘制棋盘
for(var i=0;i<23;i++)
{
//画线
gameCanvas.moveTo(10,10+i*map);
gameCanvas.lineTo(560,10+i*map);
gameCanvas.moveTo(10+i*map,10);
gameCanvas.lineTo(10+i*map,560);
gameCanvas.stroke(); //画
}
//创建函数,完成下棋
function addChess(x,y)
{
//下棋,画圆
gameCanvas.beginPath();//开始
gameCanvas.arc(x,y,11,0,2*Math.PI,true);//画棋子
gameCanvas.fillStyle = color;
gameCanvas.fill();
gameCanvas.closePath();
if(color == "#000000")
{
color = "#ff0000";
//黑棋
chessDate[i][j] = 2;
}
else
{
color = "#000000";
//红棋
chessDate[i][j] = 1;
}
}
//重复调用
//window.setInterval(函数,时间);
//游戏是否结束
//function isGamewin()
//如果是人机,则需要下棋的AI 如果不是,则落子后提醒另一个玩家落子
//function gameAI()
//鼠标监听 游戏逻辑
document.onmousedown = function(e)
{
window.onclick = function()
{
//获取下棋的坐标 并处理
i = Math.round((e.x-10)/25); //math四舍五入
j = Math.round((e.y-10)/25);
x = i*25+10;
y = j*25+10;
//判断ij是否有棋子
if(chessDate[i][j] == 0)
{
//下棋
addChess(x,y);
}
else
{
alert("不好意思!你来晚了,已经被对方捷足先登");
}
}
}
</script>
</body>
</html>
虽然还有很多不足,但已经能双人对决切磋棋艺了。
- 我的第一个HBuider项目 ——五子棋
- 我的第一个hbulider项目--五子棋
- 我的第一个html5项目--五子棋
- 我的第一个Hbulider项目——基于html5的五子棋游戏
- 我的第一个java作品——五子棋
- 第一个项目:五子棋
- 我的第一个五子棋游戏
- flash五子棋心得——致我写的第一个程序
- JAVA第一个小项目——五子棋的制作(第一篇)
- JAVA第一个小项目——五子棋的制作(第二篇)
- 我的第一个hbuilder项目,基于h5的五子棋游戏
- 我的第一个SpringBoot 项目——Hello World
- 我的第一个项目
- 我的第一个项目
- 我的第一个项目
- 我的第一个项目
- 我的第一个项目的收获
- 我的第一个WFF项目
- GTS4.1 R1常见问题处理
- Spring(03)——依赖注入
- android 应用 替换 logo 和 应用名字
- 机器学习引擎在公司内网环境发现蠕虫
- LibreOJ β Round #2 B.贪心只能过样例【Dp+bitset优化】
- 我的第一个HBuider项目 ——五子棋
- 转载:vista开发注意事项及解决方案
- nginx源码分析(持续更新)
- 关于PAT(乙级)
- Git学习笔记与IntelliJ IDEA整合
- SpringMVC整合DWR时出现这样的错误Multiple annotations found at this line:
- 笔记-NopCommerce系统架构分析-Ef数据访问
- js通用监听函数
- jvm知识点粘贴