BabylonJS একটি শক্তিশালী 3D ইঞ্জিন যা আপনাকে গেম এবং ইন্টারঅ্যাকটিভ 3D অ্যাপ্লিকেশন তৈরি করতে সাহায্য করে। গেম ডেভেলপমেন্টে Scene Management এবং Game States অত্যন্ত গুরুত্বপূর্ণ ধারণা। Scene Management এর মাধ্যমে আপনি গেমের বিভিন্ন দৃশ্য বা অবস্থার মধ্যে স্যুইচ করতে পারেন, এবং Game States গেমের বিভিন্ন পর্যায় এবং অবস্থার নিয়ন্ত্রণে সাহায্য করে।
Scene Management
Scene Management হলো গেম বা 3D অ্যাপ্লিকেশনের বিভিন্ন দৃশ্য বা পর্যায়ের মধ্যে স্যুইচ করার প্রক্রিয়া। BabylonJS এ, একটি Scene হল একটি 3D জগত বা দৃশ্য যেখানে আপনি সব ধরনের অবজেক্ট, ক্যামেরা, আলোকসজ্জা, এবং অন্যান্য উপাদান রাখতে পারেন। বিভিন্ন দৃশ্যের মধ্যে স্যুইচ করতে আপনাকে দৃশ্য তৈরি, পরিচালনা এবং ট্রানজিশন (যেমন একটি স্তর থেকে অন্য স্তরে যাওয়া) করতে হবে।
Scene তৈরি ও পরিবর্তন
একটি নতুন Scene তৈরি করতে এবং পুরানো Scene থেকে নতুন Scene এ পরিবর্তন করতে নিম্নলিখিত পদ্ধতি ব্যবহার করা যায়:
উদাহরণ: Scene Management
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BabylonJS Scene Management</title>
<script src="https://cdn.babylonjs.com/babylon.js"></script>
</head>
<body>
<canvas id="renderCanvas" style="width: 100%; height: 100%"></canvas>
<script>
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
// প্রথম Scene তৈরি
var scene1 = new BABYLON.Scene(engine);
var light1 = new BABYLON.HemisphericLight("light1", BABYLON.Vector3.Up(), scene1);
light1.intensity = 0.7;
var box1 = BABYLON.MeshBuilder.CreateBox("box1", {size: 2}, scene1);
box1.position.z = 5;
// দ্বিতীয় Scene তৈরি
var scene2 = new BABYLON.Scene(engine);
var light2 = new BABYLON.HemisphericLight("light2", BABYLON.Vector3.Up(), scene2);
light2.intensity = 0.7;
var box2 = BABYLON.MeshBuilder.CreateBox("box2", {size: 2}, scene2);
box2.position.z = 5;
// প্রথম Scene রেন্ডার করা
engine.runRenderLoop(function () {
scene1.render();
});
// Scene পরিবর্তন করার ফাংশন
function switchToScene2() {
engine.stopRenderLoop();
engine.runRenderLoop(function () {
scene2.render();
});
}
// 3 সেকেন্ড পর Scene পরিবর্তন হবে
setTimeout(switchToScene2, 3000);
window.addEventListener("resize", function () {
engine.resize();
});
</script>
</body>
</html>
কোড ব্যাখ্যা:
- Scene1 এবং Scene2: দুটি আলাদা Scene তৈরি করা হয়েছে। এক Scene এ একটি বক্স রয়েছে এবং অন্য Scene এ একটি আলাদা বক্স রয়েছে।
- switchToScene2(): এই ফাংশনটি প্রথম Scene থেকে দ্বিতীয় Scene এ পরিবর্তন করতে ব্যবহৃত হয়।
- setTimeout: এটি 3 সেকেন্ড পর Scene পরিবর্তন করতে সক্ষম হয়।
এভাবে আপনি গেমের বিভিন্ন দৃশ্য পরিবর্তন করতে পারেন।
Game States
Game States হল গেমের বিভিন্ন অবস্থা বা পর্যায় যা গেমপ্লে এবং ইউজার ইন্টারঅ্যাকশনের উপর ভিত্তি করে পরিবর্তিত হয়। গেমের কিছু সাধারণ অবস্থার মধ্যে থাকতে পারে:
- Main Menu (মেনু পর্দা)
- Playing (গেম খেলতে থাকা)
- Paused (গেম বিরতি)
- Game Over (গেম শেষ)
- Victory/Defeat (জয়/পরাজয়)
BabylonJS এ, আপনি সহজেই Game States ট্র্যাক এবং পরিচালনা করতে পারেন। প্রতিটি Game State একটি নির্দিষ্ট Scene অথবা UI উপাদান দ্বারা উপস্থাপিত হতে পারে।
উদাহরণ: Game States পরিচালনা
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BabylonJS Game States</title>
<script src="https://cdn.babylonjs.com/babylon.js"></script>
</head>
<body>
<canvas id="renderCanvas" style="width: 100%; height: 100%"></canvas>
<script>
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
var scene, gameState;
// Main Menu Scene
var mainMenuScene = new BABYLON.Scene(engine);
var light1 = new BABYLON.HemisphericLight("light1", BABYLON.Vector3.Up(), mainMenuScene);
var menuText = new BABYLON.GUI.TextBlock();
menuText.text = "Press Enter to Start";
menuText.color = "white";
menuText.fontSize = 24;
mainMenuScene.guiTexture = new BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
mainMenuScene.guiTexture.addControl(menuText);
// Playing Scene
var playingScene = new BABYLON.Scene(engine);
var light2 = new BABYLON.HemisphericLight("light2", BABYLON.Vector3.Up(), playingScene);
var box = BABYLON.MeshBuilder.CreateBox("box", {size: 2}, playingScene);
box.position.z = 5;
// Game States
function changeGameState(newState) {
gameState = newState;
switch (gameState) {
case "MainMenu":
engine.stopRenderLoop();
engine.runRenderLoop(function () {
mainMenuScene.render();
});
break;
case "Playing":
engine.stopRenderLoop();
engine.runRenderLoop(function () {
playingScene.render();
});
break;
}
}
// Key Event to Change State
window.addEventListener("keydown", function(event) {
if (event.key === "Enter" && gameState === "MainMenu") {
changeGameState("Playing");
}
});
// Set initial game state to Main Menu
changeGameState("MainMenu");
// Resize listener
window.addEventListener("resize", function () {
engine.resize();
});
</script>
</body>
</html>
কোড ব্যাখ্যা:
- gameState: এটি গেমের বর্তমান অবস্থার ট্র্যাক রাখে। গেমের অবস্থান অনুযায়ী দৃশ্য বা UI পরিবর্তন করা হয়।
- changeGameState(): এটি গেমের অবস্থা পরিবর্তন করার ফাংশন, যেখানে আমরা "MainMenu" থেকে "Playing" এ যেতে পারি।
- keydown Event: ব্যবহারকারী যখন "Enter" চাপবেন, তখন গেমটি "MainMenu" থেকে "Playing" অবস্থায় চলে যাবে।
এভাবে গেমের বিভিন্ন অবস্থার মধ্যে সহজেই স্যুইচ করা যায়।
Scene Management এবং Game States এর মধ্যে সম্পর্ক
- Scene Management এবং Game States একসাথে কাজ করে, কারণ গেমের অবস্থা (যেমন, Main Menu, Playing, Game Over) Scene এর মাধ্যমে বাস্তবায়িত হয়। একটি Scene একটি নির্দিষ্ট Game State এর জন্য উপযুক্ত হতে পারে, যেমন Main Menu বা Play Scene।
- Game State পরিবর্তন হওয়ার সাথে সাথে Scene পরিবর্তন করতে হবে, যেমন গেম শুরু হলে "Main Menu" থেকে "Playing" Scene এ স্যুইচ করা।
সারাংশ
Scene Management এবং Game States গেম ডেভেলপমেন্টে অত্যন্ত গুরুত্বপূর্ণ উপাদান। BabylonJS ব্যবহার করে আপনি সহজেই একাধিক Scene পরিচালনা করতে পারেন এবং গেমের বিভিন্ন অবস্থায় (যেমন মেনু, খেলা, বিরতি, গেম শেষ) পরিবর্তন করতে পারেন। Scene পরিবর্তন এবং Game States ব্যবস্থাপনা গেমের অভিজ্ঞতা আরও সাশ্রয়ী এবং ইন্টারঅ্যাকটিভ করতে সাহায্য করে।
Read more