کاربران گرامی در این پروژه به شما پروژه بازی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش سایر بازی هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه بازی بازی های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
### پروژه "بازی دویدن نینجا" با استفاده از جاوا اسکریپت
بازی "دویدن نینجا" یک بازی ساده و سرگرمکننده است که با استفاده از جاوا اسکریپت و HTML5 Canvas ساخته شده است. در این بازی، بازیکن کنترل یک نینجا را به عهده دارد که باید از موانع عبور کند و امتیاز جمعآوری کند.
#### ویژگیهای پروژه:
- **گرافیک ساده:** طراحی گرافیک بازی با استفاده از Canvas.
- **حرکت نینجا:** نینجا میتواند به سمت راست و چپ حرکت کند و از موانع بپرد.
- **جمعآوری امتیاز:** بازیکن میتواند سکهها را جمعآوری کند و امتیاز بگیرد.
- **پایان بازی:** نمایش پیغام پایان بازی زمانی که با مانع برخورد کند.
### کد منبع:
#### 1. فایل `index.html`
```html
Ninja Run Game
body {
margin: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: #f4f4f4;
}
canvas {
border: 2px solid #000;
background-color: #fff;
}
```
#### 2. فایل `app.js`
```javascript
const canvas = document.getElementById("gameCanvas");
const ctx = canvas.getContext("2d");
// متغیرهای بازی
let ninja = {
x: 50,
y: 300,
width: 50,
height: 50,
speed: 5,
jumping: false,
jumpHeight: 100,
gravity: 2,
velocityY: 0
};
let coins = [];
let obstacles = [];
let score = 0;
let gameOver = false;
// تابع برای ایجاد سکه
function createCoin() {
const coin = {
x: Math.random() * (canvas.width - 30) + 30,
y: Math.random() * (canvas.height - 30) + 30,
width: 30,
height: 30
};
coins.push(coin);
}
// تابع برای ایجاد موانع
function createObstacle() {
const obstacle = {
x: canvas.width,
y: 300,
width: 50,
height: 50
};
obstacles.push(obstacle);
}
// تابع برای رسم نینجا
function drawNinja() {
ctx.fillStyle = 'black';
ctx.fillRect(ninja.x, ninja.y, ninja.width, ninja.height);
}
// تابع برای رسم سکهها
function drawCoins() {
ctx.fillStyle = 'gold';
coins.forEach(coin => {
ctx.fillRect(coin.x, coin.y, coin.width, coin.height);
});
}
// تابع برای رسم موانع
function drawObstacles() {
ctx.fillStyle = 'red';
obstacles.forEach(obstacle => {
ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
});
}
// تابع برای بررسی برخورد
function checkCollision() {
// بررسی برخورد نینجا با موانع
for (let obstacle of obstacles) {
if (ninja.x < obstacle.x + obstacle.width &&
ninja.x + ninja.width > obstacle.x &&
ninja.y < obstacle.y + obstacle.height &&
ninja.y + ninja.height > obstacle.y) {
gameOver = true;
}
}
// بررسی جمعآوری سکهها
coins.forEach((coin, index) => {
if (ninja.x < coin.x + coin.width &&
ninja.x + ninja.width > coin.x &&
ninja.y < coin.y + coin.height &&
ninja.y + ninja.height > coin.y) {
coins.splice(index, 1); // حذف سکه جمعآوری شده
score++;
}
});
}
// تابع برای بروزرسانی وضعیت بازی
function update() {
if (ninja.jumping) {
ninja.y -= ninja.velocityY;
ninja.velocityY -= ninja.gravity;
if (ninja.y >= 300) {
ninja.y = 300;
ninja.jumping = false;
}
} else {
ninja.velocityY = 0;
}
obstacles.forEach(obstacle => {
obstacle.x -= 5; // حرکت موانع به سمت چپ
});
// حذف موانع خارج از صفحه
obstacles = obstacles.filter(obstacle => obstacle.x + obstacle.width > 0);
}
// تابع برای حلقه بازی
function gameLoop() {
if (gameOver) {
ctx.fillStyle = 'black';
ctx.font = '30px Arial';
ctx.fillText("Game Over!", canvas.width / 2 - 70, canvas.height / 2);
ctx.font = '20px Arial';
ctx.fillText("Final Score: " + score, canvas.width / 2 - 70, canvas.height / 2 + 30);
return;
}
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawNinja();
drawCoins();
drawObstacles();
checkCollision();
update();
requestAnimationFrame(gameLoop);
}
// مدیریت رویدادها برای پرش
document.addEventListener("keydown", (e) => {
if (e.code === "Space" && !ninja.jumping) {
ninja.jumping = true;
ninja.velocityY = ninja.jumpHeight;
}
});
// ایجاد سکهها و موانع هر چند ثانیه
setInterval(() => {
createCoin();
if (Math.random() < 0.5) createObstacle();
}, 1000);
// شروع حلقه بازی
gameLoop();
```
### توضیحات پروژه:
1. **HTML:** ساختار اصلی بازی را تشکیل میدهد و شامل یک عنصر `
2. **JavaScript:** منطق بازی را پیادهسازی میکند. شامل ویژگیهای نینجا، سکهها، موانع، سیستم امتیازدهی و حلقه بازی است.
3. **CSS:** برای زیباسازی ظاهر بازی استفاده میشود.
### نتیجهگیری:
این پروژه "بازی دویدن نینجا" به شما این امکان را میدهد که با اصول برنامهنویسی بازی با استفاده از جاوا اسکریپت و HTML5 Canvas آشنا شوید. میتوانید این پروژه را گسترش دهید و ویژگیهای بیشتری به آن اضافه کنید، مانند افزودن سطوح مختلف، گرافیک بهتر، یا سیستم قدرتهای ویژه. این پروژه یک نقطه شروع عالی برای یادگیری توسعه بازی است.
| صفحه قابل مشاهده:
دانلود پروژه "بازی دویدن نینجا" با استفاده از جاوا اسکریپت میباشد