کاربران گرامی در این پروژه به شما پروژه بازی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش سایر بازی هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه بازی بازی های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
ساخت یک بازی تیراندازی اول شخص (First Person Shooter - FPS) با استفاده از JavaScript می‌تواند یک پروژه جالب و چالش‌برانگیز باشد. در این نوع بازی‌ها، بازیکن از دید شخصیت خود بازی می‌کند و معمولاً وظیفه‌ی او از بین بردن دشمنان و پیشروی در مراحل است. در اینجا یک نمونه ساده از این نوع بازی ارائه می‌شود که با استفاده از HTML5 Canvas پیاده‌سازی شده است.
### ویژگی‌های اصلی پروژه
1. **کنترل شخصیت**: بازیکن می‌تواند شخصیت خود را به جلو و عقب حرکت دهد و بچرخاند.
2. **تیراندازی به دشمنان**: بازیکن می‌تواند به سمت دشمنان شلیک کند و آن‌ها را از بین ببرد.
3. **گرافیک ساده**: استفاده از اشکال ساده برای شخصیت و دشمنان.
4. **آمار بازی**: نمایش تعداد گلوله‌های باقی‌مانده و امتیاز.
### کد منبع نمونه
#### ۱. ایجاد فایل HTML
ابتدا یک فایل HTML به نام `index.html` ایجاد کنید و کد زیر را در آن قرار دهید:
```html
بازی تیراندازی اول شخص با جاوااسکریپت
بازی تیراندازی اول شخص (FPS)
```
#### ۲. ایجاد فایل 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: #4caf50;
color: white;
}
canvas {
border: 2px solid #000;
background-color: #2e7d32; /* زمین بازی */
}
#scoreboard {
margin-top: 20px;
}
```
#### ۳. ایجاد فایل JavaScript
یک فایل JavaScript به نام `script.js` ایجاد کنید و کد زیر را در آن قرار دهید:
```javascript
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
let score = 0; // امتیاز بازی
let ammo = 10; // تعداد گلوله‌های باقی‌مانده
// مشخصات بازیکن
const player = {
x: 50,
y: canvas.height / 2,
width: 30,
height: 30,
color: 'blue'
};
// لیست دشمنان
const enemies = [];
// زمان‌بندی برای اضافه کردن دشمنان
setInterval(() => {
const enemy = {
x: canvas.width,
y: Math.random() * canvas.height,
width: 30,
height: 30,
color: 'red',
speed: Math.random() * 3 + 1 // سرعت تصادفی
};
enemies.push(enemy);
}, 2000);
// رسم بازیکن
function drawPlayer() {
ctx.fillStyle = player.color;
ctx.fillRect(player.x, player.y, player.width, player.height);
}
// رسم دشمنان
function drawEnemies() {
enemies.forEach(enemy => {
ctx.fillStyle = enemy.color;
ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
});
}
// به‌روزرسانی وضعیت دشمنان
function updateEnemies() {
enemies.forEach((enemy, index) => {
enemy.x -= enemy.speed;
// حذف دشمن از لیست اگر از صفحه خارج شود
if (enemy.x + enemy.width < 0) {
enemies.splice(index, 1);
}
});
}
// به‌روزرسانی وضعیت بازی
function update() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawPlayer();
drawEnemies();
updateEnemies();
// نمایش امتیاز و گلوله‌های باقی‌مانده
document.getElementById('score').innerText = score;
document.getElementById('ammo').innerText = ammo;
requestAnimationFrame(update);
}
// تیراندازی
function shoot() {
if (ammo > 0) {
ammo--;
enemies.forEach((enemy, index) => {
// برخورد تیر به دشمن
if (
player.x + player.width > enemy.x &&
player.x < enemy.x + enemy.width &&
player.y + player.height > enemy.y &&
player.y < enemy.y + enemy.height
) {
enemies.splice(index, 1); // حذف دشمن
score += 10; // افزایش امتیاز
}
});
}
}
// کنترل‌های صفحه‌کلید
document.addEventListener('keydown', (e) => {
if (e.key === 'ArrowUp' && player.y > 0) {
player.y -= 10; // حرکت به بالا
} else if (e.key === 'ArrowDown' && player.y < canvas.height - player.height) {
player.y += 10; // حرکت به پایین
} else if (e.key === ' ') {
shoot(); // شلیک گلوله
}
});
// شروع بازی
update();
```
### نحوه اجرای پروژه:
1. فایل‌های `index.html`، `style.css` و `script.js` را در یک پوشه قرار دهید.
2. فایل `index.html` را در مرورگر خود باز کنید.
### نتیجه‌گیری
این پروژه یک بازی تیراندازی اول شخص ساده است که شامل حرکت بازیکن، شلیک به دشمنان و امتیازدهی می‌باشد. شما میتوانید این بازی را با اضافه کردن ویژگی‌های جدید مانند موانع، سلاح‌های مختلف، و دشمنان متنوع گسترش دهید. همچنین میتوانید برای بهبود گرافیک و جلوه‌های صوتی از تصاویر و صداهای واقعی استفاده کنید تا تجربه بازی جذاب‌تر شود.
| صفحه قابل مشاهده:
دانلود پروژه بازی تیراندازی اول شخص (First Person Shooter - FPS) با استفاده از JavaScript می‌باشد
