کاربران گرامی در این پروژه به شما پروژه بازی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش سایر بازی هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه بازی بازی های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
ساخت بازی "ماجراجویی ملون" (Melon’s Adventure) با استفاده از JavaScript یک پروژه جالب و سرگرمکننده است که میتواند شما را با مفاهیم مختلفی از جمله حرکت شخصیت، برخورد با موانع و جمعآوری امتیاز آشنا کند. در این بازی، کاربر کنترل شخصیت اصلی به نام "ملون" را بر عهده دارد که باید از موانع عبور کند، امتیاز کسب کند و مراحل مختلف را بگذراند.
### توضیحات پروژه
بازی "ماجراجویی ملون" یک بازی پلتفرم ساده است که در آن شخصیت اصلی باید از روی سکوها بپرد، موانع را رد کند و امتیازهایی مثل میوهها یا سکهها را جمعآوری کند. بازی از دید گرافیکی ساده است و کاملاً با HTML، CSS و JavaScript پیادهسازی شده است.
### ویژگیهای اصلی پروژه
1. **شخصیت قابل کنترل**: شخصیت ملون که میتواند به چپ و راست حرکت کند و بپرد.
2. **موانع و سکوها**: موانع مختلفی که باید از آنها عبور کنید و سکوهایی که باید بر روی آنها بپرید.
3. **جمعآوری امتیاز**: ملون میتواند میوهها یا سکهها را برای کسب امتیاز جمعآوری کند.
4. **مراحل مختلف**: افزودن مراحل مختلف برای چالش بیشتر.
### کد منبع نمونه
#### ۱. ایجاد فایل HTML
ابتدا یک فایل HTML به نام `index.html` ایجاد کنید و کد زیر را در آن قرار دهید:
```html
ماجراجویی ملون
ماجراجویی ملون
```
#### ۲. ایجاد فایل CSS
یک فایل CSS به نام `style.css` ایجاد کنید و کد زیر را در آن قرار دهید:
```css
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
background-color: #87CEEB; /* آسمان آبی */
}
canvas {
border: 2px solid #000;
background-color: #98FB98; /* رنگ سبز برای زمین */
}
```
#### ۳. ایجاد فایل JavaScript
یک فایل JavaScript به نام `script.js` ایجاد کنید و کد زیر را در آن قرار دهید:
```javascript
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
let melon = {
x: 50,
y: canvas.height - 70,
width: 30,
height: 30,
speed: 5,
jumpPower: 10,
gravity: 0.5,
dy: 0,
jumping: false,
};
let platforms = [
{ x: 0, y: canvas.height - 20, width: canvas.width, height: 20 },
{ x: 150, y: canvas.height - 100, width: 100, height: 10 },
{ x: 350, y: canvas.height - 150, width: 100, height: 10 },
{ x: 550, y: canvas.height - 200, width: 100, height: 10 },
];
let fruits = [
{ x: 200, y: canvas.height - 130, width: 20, height: 20 },
{ x: 400, y: canvas.height - 180, width: 20, height: 20 },
];
let score = 0;
function gameLoop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawMelon();
drawPlatforms();
drawFruits();
updateMelon();
detectCollisions();
requestAnimationFrame(gameLoop);
}
function drawMelon() {
ctx.fillStyle = 'red';
ctx.fillRect(melon.x, melon.y, melon.width, melon.height);
}
function drawPlatforms() {
ctx.fillStyle = 'brown';
platforms.forEach(platform => {
ctx.fillRect(platform.x, platform.y, platform.width, platform.height);
});
}
function drawFruits() {
ctx.fillStyle = 'orange';
fruits.forEach(fruit => {
ctx.fillRect(fruit.x, fruit.y, fruit.width, fruit.height);
});
}
function updateMelon() {
melon.y += melon.dy;
if (melon.y + melon.height < canvas.height) {
melon.dy += melon.gravity; // اعمال نیروی گرانش
} else {
melon.dy = 0;
melon.jumping = false;
melon.y = canvas.height - melon.height; // جلوگیری از رفتن به زیر زمین
}
}
function detectCollisions() {
// برخورد با سکوها
platforms.forEach(platform => {
if (melon.x < platform.x + platform.width &&
melon.x + melon.width > platform.x &&
melon.y + melon.height < platform.y + platform.height &&
melon.y + melon.height + melon.dy > platform.y) {
melon.dy = -melon.jumpPower; // پرش هنگام برخورد با سکو
melon.jumping = true;
}
});
// جمعآوری میوهها
fruits = fruits.filter(fruit => {
if (melon.x < fruit.x + fruit.width &&
melon.x + melon.width > fruit.x &&
melon.y < fruit.y + fruit.height &&
melon.y + melon.height > fruit.y) {
score += 10;
document.getElementById('result').textContent = `امتیاز: ${score}`;
return false; // حذف میوه جمعآوری شده
}
return true;
});
}
document.addEventListener('keydown', function (event) {
if (event.key === 'ArrowRight') {
melon.x += melon.speed; // حرکت به راست
} else if (event.key === 'ArrowLeft') {
melon.x -= melon.speed; // حرکت به چپ
} else if (event.key === 'ArrowUp' && !melon.jumping) {
melon.dy = -melon.jumpPower; // پرش
melon.jumping = true;
}
});
// راهاندازی بازی
gameLoop();
```
### نحوه اجرای پروژه:
1. فایلهای `index.html`، `style.css` و `script.js` را در یک پوشه قرار دهید.
2. فایل `index.html` را در مرورگر خود باز کنید.
### نتیجهگیری
این پروژه "ماجراجویی ملون" یک بازی پلتفرم ساده است که با استفاده از HTML، CSS و JavaScript ساخته شده است. این بازی به شما کمک میکند تا با مفاهیم برنامهنویسی بازیهای دو بعدی، برخورد با موانع، جمعآوری امتیاز و تعامل با کاربر آشنا شوید. شما میتوانید این بازی را با افزودن دشمنان، موانع جدید، یا بهبود گرافیکی بیشتر گسترش دهید تا بازی چالشبرانگیزتر و جذابتر شود.
| صفحه قابل مشاهده:
دانلود پروژه ساخت بازی "ماجراجویی ملون" (Melon’s Adventure) با استفاده از JavaScript میباشد