স্প্রাইট অ্যানিমেশন সেরা অভ্যাস


18

আসল বিশ্বের লোকেরা কীভাবে তাদের অ্যানিমেশন পরিচালনা করছে সে সম্পর্কে আমি আরও ভাল হ্যান্ডেল পেতে চাই।

আপনি কি ১ টি বড় চিত্র লোড করেন এবং তারপরে অ্যানিমেশন ফ্রেমের উপর ভিত্তি করে বিভিন্ন আয়তক্ষেত্র আঁকেন?

আপনি কি এক্স চিত্র ফাইলগুলি একটি অ্যারেতে লোড করেন এবং অ্যানিমেশন ফ্রেমের ভিত্তিতে অ্যারেটিতে আইটেমটি আঁকেন?

বিভিন্ন স্প্রাইটের জন্য আপনি বিভিন্ন দৈর্ঘ্যের অ্যানিমেশনগুলি কীভাবে পরিচালনা করবেন।

বলুন যে একটি চরিত্রের হাঁটাচলা 4 - 8 ফ্রেম করে এবং সৈকতের তরঙ্গগুলি কেবল 2 - 3 ফ্রেম নেয়। আপনি কীভাবে এই পরিস্থিতি সামাল দেবেন? নিচে দেখ

Dim Waves(1) as Sprite
Dim Char(5) as Sprite

Sub Animate()
     Frame += 1
     Draw Char(Frame)
     Draw Waves(Frame)
     If Frame = 5 Then Frame = 0
End Sub

স্পষ্টতই ওয়েভস সীমানা ত্রুটির সাথে শেষ হবে।

অথবা আপনার নিজের স্প্রিটের উদ্বেগ এটির নিজস্ব অ্যানিমেশন সম্পর্কে, এবং ফ্রেমের কোনও যত্ন নেই। প্রতিটি স্প্রাইটের নিজস্ব অ্যানিমেশন লুপটি জানা আছে?

উত্তর:


23

অতীতে আমি যেভাবে এটি করেছি তা হ'ল অ্যানিমেশন ডেটাটি অ্যানিমেশন প্লেব্যাক থেকে পৃথক করে । একটি Animationতখন মূলত একটি অ্যারে Framesএবং কয়েকটি বৈশিষ্ট্য হয়ে উঠতে পারে যেগুলি অ্যানিমেশনটি কীভাবে আচরণ করা উচিত তা বর্ণনা করে (যদি এটি লুপ হয়, ইত্যাদি)।

আমি সাধারণত একটি চিত্র লোড করি এবং এর টুকরো আঁকি।

প্রতিটি Frameঅ্যানিমেশন মূলত একটি আয়তক্ষেত্র এবং সময়ের দৈর্ঘ্য। এটি কিছু ফ্রেমকে অন্যের চেয়ে দীর্ঘ প্রদর্শন করতে দেয় যা আপনি চান এমন কিছু হতে পারে বা নাও পারে। যদি আপনি আপনার অ্যানিমেশনের সমস্ত ফ্রেম একই সময়ের জন্য প্রদর্শন করতে চান তবে এটি আপনার Animationঅবজেক্টে সংরক্ষণ করুন।

অ্যানিমেশন বাজানোর জন্য যে কোনও কিছুর নিজস্ব নিজস্ব AnimationPlayerযা একটিতে নির্দেশিত হতে পারে Animation। প্লেয়ার অবজেক্ট অ্যানিমেশন বাজানোর যত্ন নেয় এবং "বর্তমান ফ্রেম" উপলভ্য করে।

আমার পক্ষে এর সুবিধাটি হ'ল আমার কাছে এমন একটি একক দৃষ্টিকোণ Animationথাকতে পারে যা বহু বস্তু একই সাথে বিভিন্ন অংশে খেলতে পারে। সহজেই AnimationPlayerঅন্য Animationকোনও বস্তুর দিকে ইশারা করে এবং প্লেব্যাকটি পুনরায় সেট করে অ্যানিমেশনগুলি পরিবর্তন করা সহজ ছিল ।

সম্পাদনা : এখানে সিস্টেমের একটি মোটামুটি মৌলিক জাভাস্ক্রিপ্ট বাস্তবায়ন উপরে বর্ণিত আছে । একটি প্রদর্শন হিসাবে কয়েক মিনিটের মধ্যে আমি এটি একসাথে ছুড়ে ফেলেছি । "রিয়েল" কোডে আরও বৈশিষ্ট্য থাকবে। আপনার এটির জন্য একটি আধুনিক ব্রাউজার দরকার যা এটি কাজ করার জন্য ক্যানভাস এবং ডেটা উভয়ই ইউআরআই সমর্থন করে।


1
সে কি বললো. এছাড়াও, অ্যানিমেশনটিতে প্রতিটি ফ্রেমের জন্য একটি এক্স / ওয়াই অফসেট রাখা প্রায়শই সুবিধাজনক যাতে আপনি স্প্রিট চিত্রগুলি তাদের বাউন্ডিং বাক্সগুলিতে শক্ত করে প্যাক করতে পারেন তবে তারপরে আপনি যেখানে অ্যানিমেশন চান সেখানে এগুলি স্থাপন করতে পারেন। এটি আপনাকে কেবল একটি একক চিত্র ব্যবহার করে জিগলিংয়ের মতো কিছু প্রাথমিক জিনিস করতে দেয়।
উপুড়হস্ত

হ্যাঁ, আমি সম্পূর্ণ একমত আসলে, আমি যে অ্যানিমেশন সিস্টেমটি ব্যবহার করছি এটি এর জন্য অনুমতি দেয়। এটি চিত্রের ডেটা সম্পাদনা না করে কোনও ফ্রেমের অবস্থান পরিবর্তন করা আরও সহজ করে তোলে।
জ্যাক দ্য হিউম্যান

দুর্দান্ত কাজের উদাহরণ, ওয়াও থাম্বস আপ। এটি সুপারিশ করবে।
DFectuoso

ধরণের অ্যানিমেশনটির একটি গুরুত্বপূর্ণ সীমাবদ্ধতা হ'ল চিত্রটি ভিন্ন কোণ থেকে দেখা যায় না - দর্শকের থেকে দূরে সরে যাওয়া, দর্শকের দিকে হাঁটা ইত্যাদি etc. বা আমি ভুল করছি?
মজিদ ফৌলদপুর

@ মজিদফৌলদপুর এই কৌশলটি ব্যবহার করে আমি মনে করি না যে এ জাতীয় সীমাবদ্ধতা রয়েছে। আপনার কাছে প্রতিটি "দেখার কোণ" এর জন্য আলাদাভাবে অ্যানিমেশনডেটা অবজেক্ট রয়েছে।
জ্যাক দ্য হিউম্যান

1

এটির কতগুলি ফ্রেম রয়েছে তা আমার জানতে একটি অ্যানিমেশন থাকবে। এগুলি কোথায় এবং কীভাবে সংরক্ষণ করা হয় তা পারফরম্যান্সের সমস্যাগুলি বাদে তুলনামূলক অপ্রাসঙ্গিক (যেমন আপনি এটি একই টেক্সচারে চাইবেন)। আমি কখনও ফ্রেমকাউন্টে 1 যোগ করব না, আমি ডেল্টটাইম * এনিমস্পিড যুক্ত করব এবং প্রদর্শন করার সময় সেই মানটিকে একটি পূর্ণসংখ্যায় রূপান্তর করব। এইভাবে আপনি অ্যানিমেশনগুলি গতি কমিয়ে বা গতি বাড়িয়ে তুলতে পারেন এবং ফ্রেমরেটেড স্বতন্ত্র।

সুতরাং একটি স্প্রাইটের একটি অ্যানিমেশন থাকবে যা নিজে আপডেট হয়।


0

কেন আপনার প্রতিটি বস্তুর জন্য কেবল সংখ্যক ফ্রেম সংরক্ষণ করা হয়নি? ব্যক্তিগতভাবে আমি তাদের নির্মাণকারীগুলিতে আমার অ্যানিমেশনটিতে ফ্রেমের সংখ্যা পাস করি, তারপরে আমার কাছে একটি স্ট্যান্ডার্ড অ্যানিমেট () ফাংশন রয়েছে যা অ্যানিমেশনটিতে ফ্রেমের পরিমাণ গ্রহণ করে।


0

এটি বাস্তবায়নের উপর নির্ভর করে। আমার ইঞ্জিনে, আমি Direct3D এবং ডাইরেক্টড্র উভয় ক্ষেত্রে অ্যানিমেশন করি।

ডাইরেক্টড্রয়ে আমি একটি বড় চিত্র তৈরি করি। এটি সমস্ত যাইহোক সিস্টেম মেমোরিতে সংরক্ষিত হয়ে যায়, যা শেষ পর্যন্ত ডেটাগুলির এক-মাত্রিক ব্লকে চলে আসে।

পেশাদাররা:

  • ফ্রেমের মধ্যে সরানো সহজ। শুরু পয়েন্টারটি পরিবর্তন করুন, প্রতি y পিচটি (মোট চিত্রের প্রস্থ) যুক্ত করুন এবং আপনি সোনালী।

কনস:

  • স্ক্রিনে কেবল একটি ফ্রেম অনুলিপি করতে পারবেন না, আপনাকে এটি ম্যানুয়ালি করতে হবে।

  • স্মৃতির বিশাল ব্লক। চারপাশে হ্রাসিং ফ্রেম পেনাল্টিতে আসে।

ডাইরেক্ট 3 ডি-তে আমি আলাদা টেক্সচার ব্যবহার করি। এটি কারণ যে কোনও ডিভাইসের টেক্সচার সীমাবদ্ধতা সম্পর্কে আমার কোনও ধারণা নেই তাই আমি জানি না এটি এমনকি পুরো চিত্রের আকারের টেক্সচারকে সমর্থন করে কিনা।

পেশাদাররা:

  • আপনি সরাসরি কোনও স্ক্রিনে কোনও ফ্রেম অনুলিপি করতে পারেন, কারণ তারা সমস্ত পৃথক সত্তা।

কনস:

  • মেমরি প্রান্তিককরণের অভাব।

0

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

Dim Waves as Sprite
Dim Char as Sprite

Sub Animate()
     Char.update()
     Waves.update()
End Sub

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

বিভিন্ন ঘড়ি / প্ল্যাটফর্ম রেন্ডারিং গতি সামঞ্জস্য করতে ফ্রেমরেট সামঞ্জস্য করা এটি আরও সহজ করার অতিরিক্ত যুক্ত সুবিধা রয়েছে কারণ একমাত্র পরিবর্তন হ'ল আপনি কতবার অ্যানিমেট () কল করেন call

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.