<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<title>让熊动起来</title>
<script type="text/javascript">
var backgroundImg=new Image();
var mushroomImg=new Image();
//定义一个熊
var bearEyesClosedImg=new Image();
var speed=2;//开始的速度
var horizontalSpeed=speed;//水平速度
var verticalSpeed=-speed;//垂直速度
var bearAngle=2;//熊旋转速度
var ctx;
var screenWidth;
var screenHeight;
//定义游戏物体对象
function GameObject(){
this.x=0;
this.y=0;
this.image=null;
}
function Mushroom(){};
Mushroom.prototype=new GameObject();//继承GameObject
//定义一个熊Amimal继承GameObject
function Animal(){};
Animal.prototype=new GameObject();
Animal.prototype.angle=0;//动物的角度，目前中（即作为动物它在屏幕上旋转退回）
var animal=new Animal();//实例化一个熊
var mushroom=new Mushroom();
function gameLoop(){
//清屏
ctx.clearRect(0, 0, screenWidth, screenHeight);
ctx.save();
//绘制背景
ctx.drawImage(backgroundImg,0,0);
//绘制蘑菇
ctx.drawImage(mushroom.image,mushroom.x,mushroom.y);
animal.x+=horizontalSpeed;
animal.y+=verticalSpeed;
animal.angle+=bearAngle;
ctx.translate(animal.x+(animal.image.width/2),animal.y+(animal.image.height/2));//转换画布的用户坐标系统。
ctx.rotate(animal.angle*Math.PI/180);//旋转画布
ctx.drawImage(animal.image,-(animal.image.width/2),-(animal.image.height/2));
ctx.restore();
HasAnimalHitEdge();
}
function loadImages(){
mushroomImg.src="mushroom.png";
backgroundImg.src="forest1.jpg";
bearEyesClosedImg.src="bear_eyesclosed.png";
mushroom.image=mushroomImg;
animal.image=bearEyesClosedImg;
}
function AddEventHandlers(){
$("#container").mousemove(function(e){
mushroom.x=e.pageX-(mushroom.image.width/2);
});
}
//检测碰撞边界
function HasAnimalHitEdge(){
//熊碰到右边边界
if(animal.x>screenWidth-animal.image.width){
if(horizontalSpeed>0){
horizontalSpeed=-horizontalSpeed;
}
}
//熊碰到左边边界
if(animal.x<-10){
if(horizontalSpeed<0){
horizontalSpeed=-horizontalSpeed;
}
}
if(animal.y>screenHeight-animal.image.height){
setTimeout(function(){
horizontalSpeed=speed;
verticalSpeed=-speed;
animal.x=parseInt(screenWidth/2);
animal.y=parseInt(screenHeight/2);
gameLoop();
},2000);
}
if(animal.y<0){
verticalSpeed=-verticalSpeed;
}
}
$(window).ready(function(){
AddEventHandlers();
loadImages();
ctx=document.getElementById("canvas").getContext('2d');;
screenWidth=parseInt($("#canvas").attr("width"));
screenHeight = parseInt($("#canvas").attr("height"));
mushroom.image = mushroomImg;
mushroom.x = parseInt(screenWidth/2);// 蘑菇X坐标
mushroom.y = screenHeight - 40;//蘑菇Y坐标
animal.x = parseInt(screenWidth/2);// 蘑菇X坐标
animal.y = screenHeight - 40;//蘑菇Y坐标
setInterval(gameLoop, 10);
});
</script>
</head>
<body>
<div id="container" style="border:1px solid; cursor:none; width:480px; height:320px;">
<canvas id="canvas" width="480" height="320" >
</canvas>
</div>
</body>
</html>
分享到：
相关推荐
标题“蘑菇游戏_熊碰撞蘑菇处理”涉及到的是一个游戏开发中的特定环节，即游戏对象（熊）与环境元素（蘑菇）之间的碰撞检测和处理。在游戏编程中，碰撞检测是关键的一部分，它决定了游戏交互的精确性和玩家体验的...
总结来说，"超级蘑菇"游戏的设计和实现展示了C++ MFC在游戏开发中的应用，包括用户输入处理、对象状态管理、碰撞检测、物理模拟等多个方面。通过这样的实践项目，开发者可以加深对C++面向对象编程的理解，同时提高在...
在超级玛丽中，开发者可能使用了矩形碰撞检测算法，通过比较角色和障碍物的边界来判断是否发生碰撞。这种简单但有效的算法在很多2D游戏中广泛应用。 此外，游戏的动画效果也是吸引玩家的重要因素。在源码中，开发者...
在“马里奥蘑菇大战”中，Canvas是游戏场景的画布，所有的角色动画、碰撞检测和背景绘制都依赖于Canvas的API。 3. **游戏框架**：虽然描述中未明确指出，但通常这样的游戏可能会使用某种游戏框架，如Phaser或...
在Java中，通常使用`while`或`do-while`循环来构建游戏主循环，这个循环负责处理游戏的每一帧，包括用户输入、游戏逻辑更新、画面渲染等。在MarioProject中，这样的循环机制确保了游戏的流畅运行。 接着，游戏中的...
在Java中，我们可以利用Java Swing或JavaFX进行图形用户界面（GUI）的构建，同时结合Java的多线程技术来处理游戏的实时交互。 二、游戏架构设计 1. 游戏主循环：超级玛丽游戏的核心是一个不断运行的主循环，负责...
3. 碰撞检测：Pygame提供了Rect对象用于表示游戏对象的矩形边界，通过Rect的colliderect()方法进行简单的碰撞检测，对于更复杂的形状可能需要自定义算法。 4. 游戏逻辑：游戏的核心部分，包括玩家移动、敌人行为、...
同时，要考虑到角色的碰撞边界，防止其超出游戏区域。 3. **碰撞检测**：VB中实现碰撞检测通常采用矩形碰撞检测，即比较角色和障碍物的矩形边界。通过计算角色和障碍物的位置关系，判断是否发生碰撞。更精确的像素...
2. 游戏逻辑：这是游戏的“大脑”，负责处理游戏的规则，如角色移动、跳跃、吃到蘑菇后的增长、敌人的行动模式等。这些逻辑通常通过C++的类和方法来实现。 3. 输入处理：QT提供QEvent和Q键盘/鼠标事件来捕捉用户的...
一个线程负责游戏画面的更新，另一个线程处理游戏逻辑，如角色移动、碰撞检测等。 5. **图像处理**：游戏通常包含许多图片资源，如角色、砖块、背景等。开发者可能使用BufferedImage类来加载和显示这些图像，并利用...
在AS3.0中，游戏引擎通常包括游戏循环、事件处理、对象实例化和更新、碰撞检测等模块。游戏循环是整个游戏的心脏，负责控制游戏的帧率和每帧的执行逻辑。通过`enterFrame`事件，我们可以确保每一帧都有相应的代码...
4. **碰撞检测**：在游戏环境中，碰撞检测是必不可少的，比如马里奥碰到敌人、吃到蘑菇或者踩到乌龟。开发者可能使用了轴对齐边界框（AABB）或其他高效的碰撞检测算法来实现这一功能。 5. **物理引擎**：游戏中的...
开发者可能使用了简单的运动方程来处理马里奥的位置变化，以及碰撞检测算法（如轴对齐边界框AABB）来处理物体间的碰撞。 关卡设计通常涉及到数据结构，如二维数组或链表，用于存储关卡地图。每个元素代表不同的地形...
1. **吃蘑菇游戏**: 这个游戏可能基于经典的超级马里奥系列，涉及的主要知识点包括游戏循环、角色移动、碰撞检测以及分数系统。游戏循环是任何游戏的基础，用于持续更新屏幕并处理用户输入。角色移动需要理解坐标...
开发者可能使用了轴对齐边界框（AABB）或更复杂的算法来检测角色与其他游戏元素的碰撞，以触发相应的交互反应。 6. **地图与关卡设计**：超级玛丽的关卡结构丰富多样，开发者需要设计一套地图系统，包括静态背景、...
同时，游戏的碰撞检测也是关键部分，这通常涉及到几何算法，例如矩形碰撞检测，可能通过比较物体边界坐标实现。 此外，音效和图形界面的处理也是游戏的重要组成部分。虽然C语言本身并不直接支持图形和音频，但可以...
在Java平台上开发游戏，通常会用到Java Swing或JavaFX库来构建用户界面，以及Java的多线程技术来处理游戏逻辑和渲染。"山寨版超级玛丽"项目是利用Java编程语言复刻经典游戏《超级玛丽》的一个实例，这涉及到Java的...
如果检测到碰撞，游戏逻辑就会相应地作出反应，如马里奥不能穿过砖块，或者吃到蘑菇后变大。 角色控制是玩家与游戏交互的核心。在“marie_adventure”中，马里奥的移动速度、跳跃高度以及是否可以跳跃等特性都需要...
5. **游戏逻辑**：游戏中的动作逻辑，如跳跃、移动、吃蘑菇等，都是通过条件判断和方法调用来实现的。这些逻辑需要考虑游戏规则和物理现象，例如重力的影响。 6. **音频处理**：为了增强游戏体验，可能使用了Java的...