我的第一个HBulider项目

来源：互联网发布：linux怎么yum安装gcc 编辑：程序博客网时间：2024/06/06 02:08

七月，炎炎烈日，我们正坐在机房内写着代码，那是关于儿时大家都爱的东西——游戏。以下代码是我们实训所学。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>五子棋游戏</title>
</head>
<body>
<canvas id="myCanvas" width="570" height="570" style="border:1px solid #000000;" ></canvas>

<script type="text/javascript">
//获取Canvas的标签
var chessCanvas=document.getElementById("myCanvas");
//获取画布
var gameCanvas=chessCanvas.getContext("2d");

//棋盘大小
var map=25;
//棋子大小
var chessSize=25;

//下棋的坐标
var x = y = 0;

//棋子的颜色
var isRed = true;//==true的改下红棋，否则下黑棋
var color = "#000000";
//棋子数组,二维数组
//用于保存所
var chessData = new Array(23);
for(var i=0;i<23;i++)
{
chessData[i] = new Array(23);
for(var j=0;j<23;j++)
{
chessData[i][j]=0;
}
}
//所下棋子在棋子数组的位置
var i,j;
//绘制棋盘
for(var i=0;i<23;i++){
//划横线
gameCanvas.moveTo(10,10+i*map);
gameCanvas.lineTo(570,10+i*map);
//画竖线
gameCanvas.moveTo(10+i*map,10);
gameCanvas.lineTo(10+i*map,570);
gameCanvas.stroke();//画

}
//创建函数，完成下棋
function addChess(x,y)
{
//下棋，画小圆圈
gameCanvas.beginPath();//开始
gameCanvas.arc(x,y,6,0,Math.PI*2);//画棋子
gameCanvas.fillStyle=color;
gameCanvas.fill();
gameCanvas.closePath();//结束
if (color=="#000000")
{
color ="#ff0000";//黑体
chessData[i][j]=2;
}else{
color ="#000000";//红体
chessData[i][j] = 1;

}
//alert("该黑棋下：");
}
//重复调用

//windows.setInter

//判断该位置是否有棋子
//function isChess(){

//}
//游戏是否结束
//function isGameWin()
//如果是人机对战法,则需要下棋的AI.如果不是人机对战，则下完棋后提醒下一玩家下棋
//function gameAI()
document.onmousedown = function(e)
{
window.onclick = function()
{
i = Math.round((e.x-10)/25);
j = Math.round((e.y-10)/25);
//判断该位置x,y是否可以下棋
x=i*25+10;
y=j*25+10;

if(chessData[i][j]==0){
addChess(x,y);
}else{
alert("不好意思，你来晚了。已经被对方捷足先登了")
}
//isChess();

//alert("你点击的坐标是：");
}
}

</script>
</body>
</html>

阅读全文

0 0