ফ্যাসার ব্যবহার করে স্প্রিটশিট থেকে একটি নির্দিষ্ট স্প্রিট প্রদর্শন করা হচ্ছে

Question

আমি HTML5 জেএস ফ্রেমওয়ার্ক, ফ্যাসার ব্যবহার করে কার্ড গেম তৈরি করার চেষ্টা করছি। যেহেতু আমি একজন ভয়ংকর শিল্পী এবং নিজের ডিজাইন করতে পারি না, তাই আমি অনলাইনে খুঁজে পেয়েছি কার্ডের চিত্র খেলানোর জন্য একটি বিনামূল্যে স্প্রিটশিট ব্যবহার করছি। সমস্যাটি হচ্ছে, আমি কীভাবে ফ্যাসার ব্যবহার করে স্বতন্ত্র কার্ড প্রদর্শন করব তা অনুভব করতে পারি না।

পূর্ববর্তী ফ্রেমওয়ার্কটিতে আমি ব্যবহার করেছি, আমি ব্যবহৃত বৃহত্তর স্প্রাইট শীট থেকে পৃথক ছোট ছোট স্প্রাইট তৈরি করতে সক্ষম হয়েছি। তবে ফেসারে কীভাবে এটি করা যায় তা আমি বুঝতে পারছি না, যদি এটি কিছুটা সম্ভব হয়।

সুতরাং আমি স্প্রিটশিট হিসাবে চিত্রটি লোড করার দিকে তাকিয়েছিলাম, তবে মনে হচ্ছে স্প্রিটশিটগুলি কেবল অ্যানিমেশনের জন্য ব্যবহৃত হয় এবং আপনি স্প্রিটশিটের একটি নির্দিষ্ট 'ফ্রেম' প্রদর্শন করতে পারবেন না (দয়া করে আমি ভুল হলে আমাকে সংশোধন করুন)।

আমি মনে করি আমাকে যা করতে হবে তা হল চিত্রটিকে একটি টাইলম্যাপ হিসাবে লোড করা, তবে, আমি যে বিশেষ চিত্রটি ব্যবহার করছি সেটি বিন্যাসটি নির্দিষ্ট করে কোনও জেসন ফাইল নিয়ে আসে নি (যেমনটি আমি খুঁজে পাইনি)। জাভাস্ক্রিপ্টে নতুন হওয়াতে জেসন ফাইলটি কীভাবে ফর্ম্যাট করা উচিত তা দেখার জন্য ফেজার উত্স কোডটি পড়তে আমার সমস্যা হচ্ছে।

সুতরাং সংক্ষেপে, আমার কাছে ফ্যাসারে কার্ড খেলার স্প্রিটশিটের স্বতন্ত্র কার্ড প্রদর্শনের সর্বোত্তম উপায়টি কী দেওয়া যে ম্যাপের ডেটা উল্লেখ করে আমার কাছে কোনও জসন ফাইল নেই?

Answer 1

var sprite = game.add.sprite(x, y, 'spritesheet_name');
sprite.frame = 0;

স্প্রিটশিটগুলি অ্যানিমেশনগুলিতে সীমাবদ্ধ নয়, এগুলি ব্যবহারের একমাত্র উপায়। একটি অ্যানিমেশন বিভিন্ন সময়ে বিভিন্ন ফ্রেম প্রদর্শন করার এক উপায়। ম্যানুয়ালি একটি স্প্রাইটের ফ্রেম সেট করে আপনি স্প্রিটশিটের একটি নির্দিষ্ট অংশ প্রদর্শন করতে পারেন।

Answer 2

ফ্যাসারের দুটি ধরণের স্প্রাইট শিটের জন্য সমর্থন রয়েছে: "ক্লাসিক" সেগুলি, যেখানে প্রতিটি ফ্রেম হুবহু একই আকার হয় এবং "টেক্সচার অ্যাটলেসস" যা টেক্সচার প্যাকার, শয়েবক্স বা ফ্ল্যাশ সিসির মতো তৃতীয় পক্ষের অ্যাপ্লিকেশনটির সাহায্যে তৈরি হয় এবং আসে একটি সম্পর্কিত জেসন ফাইল সহ।

আপনি "ক্লাসিক" এগুলি লোড করুন game.load.spritesheetযেখানে আপনাকে ফ্রেমের প্রস্থ এবং উচ্চতা এবং বৈকল্পিকভাবে পরিমাণ নির্দিষ্ট করতে হবে, যেমন:

game.load.spritesheet('uniqueKey', 'assets/sprites/metalslug_mummy37x45.png', 37, 45, 18);

একটি টেক্সচার অ্যাটলাস লোড করতে আপনি ব্যবহার করতে পারেন game.load.atlas। ফেলার উদাহরণগুলির রেপোতে আপনি এর প্রচুর উদাহরণ পাবেন।

একবার লোড হয়ে আপনার স্প্রিট তৈরি করুন:

var sprite = game.add.sprite(x, y, 'spriteSheetKey');

এটি ফেজারকে চাবিটি দিয়ে spriteSheetKeyটেক্সচারটি ব্যবহার করে বলতে হবে । ডিফল্টরূপে এটি স্প্রাইট শীটের 0 ফ্রেমে চলে যাবে, তবে আপনি এটিকে sprite.frameঅন্য কোনও বৈধ সংখ্যার সাথে পরিবর্তন করতে পারবেন ।

স্প্রাইট যদি কোনও টেক্সচার অ্যাটলাস ব্যবহার করে থাকে তবে ফ্রেমের নামের উপর ভিত্তি করে ফ্রেম পরিবর্তন করা আরও সহজ: sprite.frameName = 'card4'যেখানে ফ্রেমের নাম টেক্সচার অ্যাটলাস জসন ফাইলে ঠিক উল্লিখিত হয়েছে (এটি খুলুন এবং এটি দেখতে এটি দেখুন)।