<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/lufylegend-1.10.1.js"></script>
</head>
<html>
<style>
</style>
<body>
<div id="mylegend">loading...</div>
</body>
</html>
<script type="text/javascript">
var backLayer;
var resultLayer;
var clickLayer;
var loadingLayer;
var selfBitmap;
var enemyBitmap;
var selfTextAll;
var selfTextWin;
var selfTextLoss;
var selfTextDraw;
var win = 0;
var loss = 0;
var draw = 0;
var loader;
var imgData = new Array(
{name: 'title', path: 'img/title.png'},
{name: 'shitou', path: 'img/shitoujiandaobu.jpg'},
{name: 'jiandao', path: 'img/shitoujiandaobu.jpg'},
{name: 'bu', path: 'img/shitoujiandaobu.jpg'}
);
var imgList = {};
var showList = new Array();
init(50, "mylegend", 800, 400, main);
function main() {
backLayer = new LSprite();
addChild(backLayer);
loadingLayer = new LoadingSample3();
backLayer.addChild(loadingLayer);
LLoadManage.load(
imgData,
function(progress) {
loadingLayer.setProgress(progress);
},
function(result) {
imgList = result;
backLayer.removeChild(loadingLayer);
loadingLayer = null;
gameInit();
}
)
}
function gameInit() {
showList.push(new LBitmapData(imgList['shitou']));
showList.push(new LBitmapData(imgList['jiandao']));
showList.push(new LBitmapData(imgList['bu']));
//添加游戏界面背景
backLayer.graphics.drawRect(10, '#008800', [0, 0, LGlobal.width, LGlobal.height], true, '#000000');
//显示游戏标题
var titleBitmap = new LBitmap(new LBitmapData(imgList['title']));
titleBitmap.x = (LGlobal.width - titleBitmap.width) / 2;
titleBitmap.y = 10;
backLayer.addChild(titleBitmap);
loader = new LLoader();
//玩家方出拳图片
var img_player = new Image();
img_player.src = 'img/shitoujiandaobu.jpg';
var bitmap_com = new LBitmapData(img_player, 195, 0, 125, 110);
selfBitmap = new LBitmap(bitmap_com);
selfBitmap.x = 200;
selfBitmap.y = 130;
backLayer.addChild(selfBitmap);
//电脑方出拳图片
var img_com = new Image();
img_com.src = 'img/shitoujiandaobu.jpg';
var bitmap_com = new LBitmapData(img_com, 195, 0, 125, 110);
enemyBitmap = new LBitmap(bitmap_com);
enemyBitmap.x = 460;
enemyBitmap.y = 130;
backLayer.addChild(enemyBitmap);
//玩家 电脑名称设定
var nameText;
nameText = new LTextField();
nameText.text = '玩家';
nameText.weight = 'bolder';
nameText.color = '#ffffff';
nameText.size = 20;
nameText.x = 240;
nameText.y = 98;
backLayer.addChild(nameText);
nameText = new LTextField();
nameText.text = '电脑';
nameText.weight = 'bolder';
nameText.color = '#ffffff';
nameText.size = 20;
nameText.x = 500;
nameText.y = 98;
backLayer.addChild(nameText);
//结果显示层初始化
initResultLayer();
//操作层初始化
initClickLayer();
}
function initResultLayer() {
resultLayer = new LSprite();
resultLayer.graphics.drawRect(4, 'ff8800', [0, 0, 150, 110], true, '#ffffff');
resultLayer.x = 10;
resultLayer.y = 100;
backLayer.addChild(resultLayer);
selfTextAll = new LTextField();
selfTextAll.text = '猜拳次数：0';
// selfTextAll.weight = 'border';
selfTextAll.x = 10;
selfTextAll.y = 20;
resultLayer.addChild(selfTextAll);
selfTextWin = new LTextField();
selfTextWin.text = '胜利次数：0';
// selfTextWin.weight = 'border';
selfTextWin.x = 10;
selfTextWin.y = 40;
resultLayer.addChild(selfTextWin);
selfTextLoss = new LTextField();
selfTextLoss.text = '失败次数：0';
// selfTextLoss.weight = 'border';
selfTextLoss.x = 10;
selfTextLoss.y = 60;
resultLayer.addChild(selfTextLoss);
selfTextDraw = new LTextField();
selfTextDraw.text = '平局次数：0';
// selfTextDraw.weight = 'border';
selfTextDraw.x = 10;
selfTextDraw.y = 80;
resultLayer.addChild(selfTextDraw);
}
function initClickLayer() {
clickLayer = new LSprite();
clickLayer.graphics.drawRect(4, 'ff8800', [0, 0, 300, 110], true, '#ffffff');
var msgText = new LTextField();
msgText.text = '请出拳：';
// msgText.weight = 'border';
msgText.x = 10;
msgText.y = 10;
clickLayer.addChild(msgText);
var btnShitou = getButton('shitou');
btnShitou.x = 30;
btnShitou.y = 35;
clickLayer.addChild(btnShitou);
btnShitou.addEventListener(LMouseEvent.MOUSE_UP, onclick);
clickLayer.x = 250;
clickLayer.y = 275;
backLayer.addChild(clickLayer);
var btnJiandao = getButton('jiandao');
btnJiandao.x = 115;
btnJiandao.y = 35;
clickLayer.addChild(btnJiandao);
btnJiandao.addEventListener(LMouseEvent.MOUSE_UP, onclick);
clickLayer.x = 250;
clickLayer.y = 275;
backLayer.addChild(clickLayer);
var btnBu = getButton('bu');
btnBu.x = 200;
btnBu.y = 35;
clickLayer.addChild(btnBu);
btnBu.addEventListener(LMouseEvent.MOUSE_UP, onclick);
clickLayer.x = 250;
clickLayer.y = 275;
backLayer.addChild(clickLayer);
}
function getImg(value) {
var img = new Image();
img.src = 'img/shitoujiandaobu.jpg';
var img;
switch(value) {
case 'jiandao':
img = new LBitmapData(img, 10, 0, 125, 120);
break;
case 'shitou':
img = new LBitmapData(img, 195, 0, 125, 110);
break;
case 'bu':
img = new LBitmapData(img, 380, 0, 125, 110);
break;
}
return img;
}
function getButton(value) {
var img = new Image();
img.src = 'img/shitoujiandaobu.jpg';
var btnImg;
switch(value) {
case 'jiandao':
btnImg = new LBitmapData(img, 10, 0, 125, 120);
break;
case 'shitou':
btnImg = new LBitmapData(img, 195, 0, 125, 110);
break;
case 'bu':
btnImg = new LBitmapData(img, 380, 0, 125, 110);
break;
}
var btnUp = new LBitmap(btnImg);
btnUp.scaleX = 0.5;
btnUp.scaleY = 0.5;
var btnOver = new LBitmap(btnImg);
btnOver.scaleX = 0.5;
btnOver.scaleY = 0.5;
btnOver.x = 2;
btnOver.y = 2;
var btn = new LButton(btnUp, btnOver);
btn.name = value;
return btn;
}
var checkList = [
[0, 1, -1],
[-1, 0, 1],
[1, -1, 0]
];
function onclick(event, display) {
var selfValue, enemyValue;
if (display.name == 'shitou') {
selfValue = 0;
} else if (display.name == 'jiandao') {
selfValue = 1;
} else if (display.name == 'bu') {
selfValue = 2;
}
selfBitmap = new LBitmap(getImg(display.name));
selfBitmap.x = 200;
selfBitmap.y = 130;
backLayer.addChild(selfBitmap);
enemyValue = Math.floor(Math.random() * 3);
if (enemyValue == 0) {
enemyBitmap = new LBitmap(getImg('shitou'));
} else if (enemyValue == 1) {
enemyBitmap = new LBitmap(getImg('jiandao'));
} else if (enemyValue == 2) {
enemyBitmap = new LBitmap(getImg('bu'));
}
enemyBitmap.x = 460;
enemyBitmap.y = 130;
backLayer.addChild(enemyBitmap);
var result = checkList[selfValue][enemyValue];
if (result == -1) {
loss += 1;
} else if(result == 1) {
win += 1;
} else {
draw += 1;
}
selfTextWin.text = '胜利次数：' + win;
selfTextLoss.text = '失败次数：' + loss;
selfTextDraw.text = '平局次数：' + draw;
selfTextAll.text = '猜拳次数：' + (win + loss + draw);
}
</script>
HTML5 canvas开发的石头剪刀布小游戏
5星 · 超过95%的资源 需积分: 31 136 浏览量
2017-04-27
16:55:38
上传
评论
收藏 95KB RAR 举报 
shitoujiandaobu.rar （5个子文件） 
shitoujiandaobu js 
jquery-1.9.1.min.js 90KB lufylegend-1.10.1.js 248KB
shitoujiandaobu.html 8KB img 
title.png 1KB
shitoujiandaobu.jpg 16KB
评论1
最新资源