|
篇一:jQuery+DIV碰撞检测(猫捉老鼠游戏)
<!--何奕勇 - heyiyong - qq - 290248126 说明:jQuery+DIV碰撞检测(猫捉老鼠游戏) -->
<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
.mao {
background: #ff6e06;
position: fixed;
width: 50px;
height: 50px;
font-size: 25px;
line-height: 50px;
text-align: center;
z-index: 100;
}
.laoshu {
background: #21ff00;
position: fixed;
top: 300px;
left: 500px;
width: 100px;
height: 100px;
font-size: 25px;
text-align: center;
line-height: 100px;
}
.result {
height: 80px;
width: 300px;
background: #ffafb9;
color: #219aff;
font-weight: bolder;
font-size: 30px;
text-align: center;
margin: 10px auto;
line-height: 80px;
}
</style>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">
var maoX = 0;//水平方向位移
var maoY = 0;//垂直方向位移
var laoshuX = 500;//水平方向位移
var laoshuY = 300;//垂直方向位移
/**
* 上下左右移动事件
*/
$(document).keydown(function (event) {
if (event.which === 37) {
maoY = maoY - 10;
$("#mao").css("left", maoY + "px");
} else if (event.which === 38) {
maoX = maoX - 10;
$("#mao").css("top", maoX + "px");
} else if (event.which === 39) {
maoY = maoY + 10;
$("#mao").css("left", maoY + "px");
} else if (event.which === 40) {
maoX = maoX + 10;
$("#mao").css("top", maoX + "px");
}
});
function pengzhuangCheck() {
//得到猫的高度和宽度以及(距离左侧和上端的距离)
var maoOffset = $("#mao").offset();
var maoWidth = parseInt($("#mao").css("width").replace("px", "")); var maoHeight = parseInt($("#mao").css("height").replace("px", "")); //得到老鼠的高度和宽度以及(距离左侧和上端的距离) var laoshuOffset = $("#laoshu").offset();
var laoshuHeight = parseInt($("#laoshu").css("height").replace("px", "")); var laoshuWidth = parseInt($("#laoshu").css("width").replace("px", "")); //左侧和上方相交的bool值
var leftBool;
var topBool;
//处理左侧相交
if (maoOffset.left > laoshuOffset.left) {
leftBool = maoOffset.left - laoshuOffset.left - laoshuWidth < 0;
// console.log("猫在右边,左侧相交:"+leftBool); } else {
leftBool = laoshuOffset.left - maoOffset.left - maoWidth < 0; // console.log("猫在左边,左侧相交: "+leftBool); }
//处理上方相交
if (maoOffset.top > laoshuOffset.top) {
topBool = maoOffset.top - laoshuOffset.top - laoshuHeight < 0; // console.log("猫在下方,上方相交:"+topBool); } else {
topBool = laoshuOffset.top - maoOffset.top - maoHeight < 0; // console.log("猫在上方, 上方相交:"+topBool); }
//上方和左侧共同相交则代表碰撞
if (leftBool && topBool) {
// alert("捉到老鼠了!");
$("div[class=result]").html("抓到老鼠了!");
} else {
$("div[class=result]").html("赶紧抓你的老鼠!");
}
}
/**
* 老鼠自己跑动
*/
function mouseAutoMove() {
var num = Math.round(Math.random() * 10) % 4;
switch (num) {
case 0 ://上
laoshuY -= 5;
$("#laoshu").css("top", laoshuY + "px");
break;
case 1 ://下
laoshuY += 5;
$("#laoshu").css("top", laoshuY + "px");
break;
case 2 ://左
laoshuX -= 5;
$("#laoshu").css("left", laoshuX + "px");
break;
case 3 ://右
laoshuX += 5;
$("#laoshu").css("left", laoshuX + "px");
break;
}
//每执行一次移动就要判断一次碰撞检测 pengzhuangCheck();
}
//页面加载后调用的函数
$(function () {
//让老鼠自己动
setInterval("mouseAutoMove()", 80);})
</script>
</head>
<body>
<div id="mao" class="mao">
猫
</div>
<div id="laoshu" class="laoshu">
老鼠
</div>
<div class="result"></div>
</body>
</html>
篇二:需求分析文档模板
游戏射击
软件需求分析规格说明书
Requirement Analysis Specification
编 制 人编制日期: 审 核: 批 准:
单位名称:
1
目录
第一章 引言………………………………………………………………1 1.1 目标与范围………………………………………………………….3 1.2 系统概述……………………………………………………………..3 1.3 约束条件……………………………………………………………3 第二章 信息描述……………………………………………………….3 2.1 信息流…………………………………………………………………3 2.1.1 数据流……………………………………………………………..3 2.1.2 控制流…………………………………………………………….3 2.2 对象描述………………………………………………………………3 2.2.1 用例图………………………………………………………………3 2.2.2 对象-关系模型……………………………………………………3 2.2.3 对象-行为模型……………………………………………………...3 2.3 数据关系………………………………………………………………..4 2.4 数据字典……………………………………………………………….4 第三章 功能描述……………………………………………………………5 3.1 处理说明……………………………………………………………….5 3.2 性能说明……………………………………………………………….5 3.3 设计约束……………………………………………………………….5 第四章 控制描述…………………………………………………………….5 4.1 控制规格说明…………………………………………………………..5 4.2 设计约束………………………………………………………………..5 第五章 行为描述…………………………………………………………….6 5.1 系统状态……………………………………………………………..….6 5.1 事件与动作………………………………………………………….…..6 第六章 开发工具与开发环境……………………………………………….6 6.1 开发环境……………………………………………………………..….6 6.2 开发工具………………………………………………………………...6
2
第一章 引言 1.1 目标与范围
本实训要求学生对“射击游戏”进行分析、设计及编程实现。
本实训对实训项目已经作了较为详细的分析及相关知识讲解,通过实训,促使学生专业技能得到综合训练,让学生了解基于opengl游戏软件开发基本技术和工作过程。同时,本实训中将会让学生了解图形界面设计基本技术和碰撞检测并且显示好的爆炸效果图。
通过本系统的开发,同学门要了解软件开发的整个过程,掌握软件开发的基本方法,提前培养我们以后从事软件行业应具备的基本素质和能力,为以后的学习作一个铺垫。
在射击游戏中要求有一个可碰撞检测,爆炸,并可以积分,当敌人和敌机追过来时,可以使用武器向敌人和敌机射击,如果打中敌人或敌机则得分,否则就减少自己的生命值。
1.2 系统概述
运行操作系统在Windows XP上, 1.3 约束条件
分辨率不高,可能实验的爆炸效果不好。 第二章 信息描述 2.1 信息流 (略)
2.1.1 数据流 (略)
2.1.2 控制流 (略) 2.2 对象描述 2.
2.2.2 对象-关系模型
3
2.2.3 对象-行为模型
行为关系结构图
2.3 数据关系 2.4 数据字典
4
第三章 功能描述 3.1 处理说明
? 射击游戏要求有一个可碰撞检测,爆炸,并可以积分,当敌人和敌机追过来时,
可以使用武器向敌人和敌机射击,如果打中敌人或敌机则得分,否则就减少自己的生命值。
系统功能结构图
3.2 性能说明
1)保证制作出来的模型可以被识别 2)要求游戏能快速响应用户 3)准确无误的计算统计数据 4)显示好的爆炸效果图 3.3 设计约束
1)担心不能检测到碰撞
2)担心射击过程中不能正确无误的显示爆炸效果
第四章 控制描述
进入游戏界面开始游戏时,主人公进入场景就可以进行战斗了,主人公可
以在场景中奔跑,对敌人敌机进行射击,击中后显示爆炸效果,并且积分增加,在规定的时间内击败所有的敌人时,游戏胜利,否则游戏失败!
4.1 控制规格说明
1.游戏视角:
采用全3D视角,可以用鼠标控制。
2.战斗模式:
即时战斗,主人公进入场景就可以进行战斗了。
5
篇三:基于Actionscript 3.0碰撞检测类游戏设计
基于Actionscript 3.0碰撞检测类flash游戏设计
摘要:本文利用actionscript3.0中的hitTestObject()方法制作了一个简单碰撞检测类flash游戏。hitTestObject()方法在flash游戏设计中使用频率高,运行速度快,利用它可以设计很多动作类和碰撞检测类flash游戏。
关键词:碰撞检测 动作 游戏设计 网络游戏
The Game Design of flash game about hitTest
Based on Actionscript3.0
Abstract:In the paper,it implements a simple flash game about hitTest using the hitTestObject method in actionscript3. hitTestObject method is usually used in flash game design, Running speed.using it we can design many action and hittest flash game.
Keyword: hitTest Action game design network game
0引言
近年来,随着网络游戏产业的不断发展,网络上出现了大量用Actionscript 3.0制作的游戏。一些社交网站也大量使用了Actionscript 3.0制作的交互游戏,如开心网,腾讯QZone和腾讯校友等网站中都有很多利用Actionscript 3.0制作的交互游戏。本文就以Actionscript 3.0
[1]为例讲述简单碰撞检测类游戏的设计实现。
1 关键知识简介
1.1 事件机制
ActionScript 3.0事件模型基于文档对象模型 (DOM) 第3级事件规范,是业界标准的事
[2]件处理体系结构,为ActionScript程序员提供了强大而直观的事件处理工具。
程序员可以使用事件侦听器“侦听”代码中的事件对象。“事件侦听器”是编写的用于响应特定事件的函数或方法。要确保程序响应事件,必须将事件侦听器添加到事件目标,或
[3]添加到作为事件对象事件流的一部分的任何显示列表对象。
无论何时编写事件侦听器代码,该代码都会采用以下基本结构:
function eventResponse(eventObject:EventType):void
{
// 此处是为响应事件而执行的动作。
}
eventTarget.addEventListener(EventType.EVENT_NAME, eventResponse);
此代码执行两个操作。首先,它定义一个函数,这是指定为响应事件而执行的动作的方法。接下来,调用源对象的addEventListener()方法,实际上就是为指定事件“订阅”该函数,以便当该事件发生时,执行该函数的动作。当事件实际发生时,事件目标将检查其注册为事件侦听器的所有函数和方法的列表。然后,它依次调用每个对象,以将事件对象作为参数进行传递。
1.2 hitTestObject()方法
Actionscript3.0利用hitTestObject()方法来检测两个对象(通常为影片剪辑)是否重叠或相撞,如果两个对象相撞后该方法放回值为true,否则为false。在碰撞检测类和动作类游戏中
需要用到该方法。
[5]例如下面代码即可用来检测两个对象是否相撞。
if(mc_instance1.hitTestObject(mc_instance2)){
text1.text="两个对象相撞了!";
……//其他代码。
} [4]
2 游戏设计
本文打算实现一个空中接水果的游戏,当水果从树上掉下来时,参与游戏人员需要利用篮子接住掉下来的水果。若用户丢失的水果超过一定的数量(比如20个),则游戏失败。或者在丢失的水果超过一定的数量(比如20个)之前接住了要求的水果数量(比如20个),则游戏成
[6]功。
3游戏实现
为实现该游戏的功能,需制作几个水果影片(如Apple,Strawberry,Pear,Banana,Orange),还需制作一个水果篮影片(如basket_mc)。程序运行过程中由ActionScript脚本控制水果实例从舞台上端往舞台下端坠落,参与游戏者可以用鼠标拖动水果篮(如basket_mc)来接住落下
[7]的水果。游戏核心代码如下所示。
import flash.events.Event;
import flash.display.MovieClip;
var fruitArray:Array=new Array(Apple,Strawberry,Pear,Banana,Orange);
var fruitsOnstage:Array=new Array();
var fruitsCollected:int=0;
var fruitsLost:int=0;
for(var i:int=0;i<20;i++){
var pickFruit=fruitArray[int(Math.random()*fruitArray.length)]
var fruit:MovieClip=new pickFruit();
addChild(fruit);
fruit.x=Math.random()*stage.stageWidth;
fruit.y=Math.random()*-500;
fruit.speed=Math.random()*15+5;
fruitsOnstage.push(fruit);
}
basket_mc.addEventListener(MouseEvent.MOUSE_DOWN,dragBasket);
stage.addEventListener(MouseEvent.MOUSE_UP,dragStop);
function dragBasket(e:Event):void{
basket_mc.startDrag();
}
function dragStop(e:Event){
basket_mc.stopDrag();
}
stage.addEventListener(Event.ENTER_FRAME,catchFruit);
function catchFruit(e:Event):void{
for(var i:int=fruitsOnstage.length-1;i>-1;i--)
{
var currentFruit:MovieClip=fruitsOnstage[i];
currentFruit.y+=currentFruit.speed;
if(currentFruit.y>stage.stageHeight-currentFruit.height){
currentFruit.y=0-currentFruit.height;
fruitsLost++;
field2_txt.text="Total Fruit Lost: "+fruitsLost;
}
if(currentFruit.hitTestObject(basket_mc)){
fruitsCollected++;
removeChild(currentFruit);
fruitsOnstage.splice(i,1);
field1_txt.text="Total Fruit Collected:"+fruitsCollected;
if(fruitsCollected>=20){
basket_mc.gotoAndStop(20);
} else if(fruitsCollected>15){
basket_mc.gotoAndStop(15);
} else if(fruitsCollected>10){
basket_mc.gotoAndStop(10);
} else if(fruitsCollected>5){
basket_mc.gotoAndStop(5);
}
}
if(fruitsOnstage.length<=0){
field1_txt.text="You win! You have collected enough fruit for dinner."; field2_txt.text="";
stage.removeEventListener(Event.ENTER_FRAME,catchFruit);
}
if(fruitsLost>=20){
field1_txt.text="Sorry! You have lost too much fruit!";
field2_txt.text="";
for(var j:int=fruitsOnstage.length-1;j>-1;j--){
currentFruit=fruitsOnstage[j];
removeChild(currentFruit);
fruitsOnstage.splice(j,1);
}
}
}
}
游戏运行结果如图1所示。
图1 游戏运行结果图
4总结
hitTestObject()方法是actionscript3.0中比较重要的方法,利用该方法可以制作很多动作类和碰撞检测类Flash游戏。
参考文献:
[1]吴志华,邱军虎.Flash cs4动画设计与制作[M].北京:人民邮电出版社.2009.09
[2]马增友,宋敏等.Adobe Flash CS4动画设计与制作标准实训教程[M].北京:印刷工业出版社.2011.06.
[3]Keith Peters(著),苏金国,荆涛等译.Flash ActionScript 3.0动画高级教程[M].北京:人民邮电出版社.2010.01.
[4]翟宝利.ActionScript 3.0从入门到精通[M].北京:化学工业出版社.2009.09.
[5]杨东昱.Flash动画即战力ActionScript 3.0范例随学随用[M].北京:清华大学出版社.2009.10.
[6]朱治国,缪亮,陈艳丽.Flash ActionScript 3.0编程技术教程[M].北京:清华大学出版社.2008.06
[7]Adobe公司(著),井中月(译).Adobe Flash CS5 ActionScript 3.0中文版经典教程[M].北京:人民邮电出版社.2010.11
《iOS,Game模板碰撞检测的一些细节》出自:百味书屋
链接地址:http://www.850500.com/news/70770.html
转载请保留,谢谢! |
|