کاربران گرامی در این پروژه به شما پروژه کاربردی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش دانلود پروژه کاربردی با جاوااسکریپت سایر پروژه هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه کاربردی پروژه های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
ساخت یک بازی پلتفرمر ساده با استفاده از 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: #f0f0f0;
}
canvas {
border: 1px solid #000;
background-color: #e0e0e0;
}
```
#### ۳. ایجاد فایل JavaScript
یک فایل JavaScript به نام `script.js` ایجاد کنید و کد زیر را در آن قرار دهید:
```javascript
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
let player = {
x: 50,
y: canvas.height - 60,
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: 100, y: canvas.height - 100, width: 100, height: 10 },
{ x: 300, y: canvas.height - 150, width: 100, height: 10 },
{ x: 500, y: canvas.height - 200, width: 100, height: 10 },
];
let score = 0;
function gameLoop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawPlayer();
drawPlatforms();
updatePlayer();
detectCollisions();
requestAnimationFrame(gameLoop);
}
function drawPlayer() {
ctx.fillStyle = 'blue';
ctx.fillRect(player.x, player.y, player.width, player.height);
}
function drawPlatforms() {
ctx.fillStyle = 'green';
platforms.forEach(platform => {
ctx.fillRect(platform.x, platform.y, platform.width, platform.height);
});
}
function updatePlayer() {
player.y += player.dy;
if (player.y + player.height < canvas.height) {
player.dy += player.gravity; // اعمال نیروی گرانش
} else {
player.dy = 0;
player.jumping = false;
player.y = canvas.height - player.height; // جلوگیری از رفتن به زیر زمین
}
}
function detectCollisions() {
platforms.forEach(platform => {
if (player.x < platform.x + platform.width &&
player.x + player.width > platform.x &&
player.y + player.height < platform.y + platform.height &&
player.y + player.height + player.dy > platform.y) {
player.dy = -player.jumpPower; // پرش هنگام برخورد با سکو
player.jumping = true;
}
});
}
document.addEventListener('keydown', function (event) {
if (event.key === 'ArrowRight') {
player.x += player.speed; // حرکت به راست
} else if (event.key === 'ArrowLeft') {
player.x -= player.speed; // حرکت به چپ
} else if (event.key === 'ArrowUp' && !player.jumping) {
player.dy = -player.jumpPower; // پرش
player.jumping = true;
}
});
gameLoop();
```
### نحوه اجرای پروژه:
1. فایل‌های `index.html`، `style.css` و `script.js` را در یک پوشه قرار دهید.
2. فایل `index.html` را در مرورگر خود باز کنید.
### نتیجه‌گیری
این پروژه یک بازی پلتفرمر ساده است که به شما کمک می‌کند تا با مفاهیم برنامه‌نویسی بازی، انیمیشن‌ها و تعاملات کاربر آشنا شوید. شما میتوانید با اضافه کردن ویژگی‌های جدید مانند موانع، امتیازدهی یا بهبود طراحی، این بازی را گسترش دهید. همچنین میتوانید شخصیت‌های مختلف و سکوهای جدید اضافه کنید تا بازی جذاب‌تر شود.
| صفحه قابل مشاهده:
دانلود پروژه بازی پلتفرمر ساده با استفاده از JavaScript می‌باشد
