অ্যানিমেশন এমন ভিজ্যুয়াল সংকেত যোগ করতে পারে যা আপনার অ্যাপে কী ঘটছে সে সম্পর্কে ব্যবহারকারীদের অবহিত করে। যখন UI-এর অবস্থার পরিবর্তন হয়, যেমন নতুন কন্টেন্ট লোড হলে বা নতুন অ্যাকশন উপলব্ধ হলে, তখন এগুলি বিশেষভাবে কার্যকর। অ্যানিমেশন আপনার অ্যাপে একটি পরিশীলিত রূপও যোগ করে, যা এটিকে একটি উচ্চ মানের চেহারা ও অনুভূতি প্রদান করে।
আপনি কী ধরনের অ্যানিমেশন চান, তার উপর নির্ভর করে অ্যান্ড্রয়েডে বিভিন্ন অ্যানিমেশন এপিআই রয়েছে। এই ডকুমেন্টেশনে আপনার ইউআই-তে গতি যোগ করার বিভিন্ন উপায় সম্পর্কে একটি সংক্ষিপ্ত বিবরণ দেওয়া হয়েছে।
কখন অ্যানিমেশন ব্যবহার করা উচিত তা আরও ভালোভাবে বুঝতে, মোশন সম্পর্কিত ম্যাটেরিয়াল ডিজাইন গাইডটিও দেখুন।
বিটম্যাপ অ্যানিমেট করুন
চিত্র ১. একটি অ্যানিমেটেড অঙ্কনযোগ্য বস্তু।
আইকন বা ইলাস্ট্রেশনের মতো বিটম্যাপ গ্রাফিককে অ্যানিমেট করতে ড্রয়েবল অ্যানিমেশন এপিআই (API) ব্যবহার করুন। সাধারণত, এই অ্যানিমেশনগুলো একটি ড্রয়েবল রিসোর্সের মাধ্যমে স্ট্যাটিক্যালি সংজ্ঞায়িত করা হয়, তবে আপনি রানটাইমেও অ্যানিমেশনের আচরণ নির্ধারণ করতে পারেন।
উদাহরণস্বরূপ, ব্যবহারকারীকে দুটি কাজের মধ্যে সম্পর্ক বোঝানোর একটি সুন্দর উপায় হলো একটি প্লে বাটনকে অ্যানিমেট করা, যা ট্যাপ করলে পজ বাটনে রূপান্তরিত হয়।
আরও তথ্যের জন্য, ‘Animet drawable graphics’ পড়ুন।
UI-এর দৃশ্যমানতা এবং গতি অ্যানিমেট করুন
চিত্র ২। কোনো ডায়ালগ বক্স আসা-যাওয়ার সময় একটি সূক্ষ্ম অ্যানিমেশন UI পরিবর্তনকে কম বেমানান করে তোলে।
আপনার লেআউটে ভিউগুলির দৃশ্যমানতা বা অবস্থান পরিবর্তন করার প্রয়োজন হলে, সূক্ষ্ম অ্যানিমেশন অন্তর্ভুক্ত করাই শ্রেয়, যা ব্যবহারকারীকে UI-এর পরিবর্তনটি বুঝতে সাহায্য করে।
বর্তমান লেআউটের মধ্যে ভিউ সরাতে, দেখাতে বা লুকাতে, আপনি android.animation প্যাকেজের দেওয়া প্রপার্টি অ্যানিমেশন সিস্টেমটি ব্যবহার করতে পারেন, যা Android 3.0 (API লেভেল 11) এবং তার উপরের সংস্করণগুলিতে উপলব্ধ। এই API-গুলি একটি নির্দিষ্ট সময় ধরে আপনার View অবজেক্টের প্রপার্টিগুলো আপডেট করে এবং প্রপার্টি পরিবর্তনের সাথে সাথে ভিউটিকে ক্রমাগত পুনরায় আঁকে। উদাহরণস্বরূপ, যখন আপনি position প্রপার্টি পরিবর্তন করেন, তখন ভিউটি স্ক্রিন জুড়ে সরে যায়। যখন আপনি alpha প্রপার্টি পরিবর্তন করেন, তখন ভিউটি ধীরে ধীরে দৃশ্যমান বা অদৃশ্য হয়ে যায়।
এই অ্যানিমেশনগুলি তৈরি করার সবচেয়ে সহজ উপায় হলো আপনার লেআউটে অ্যানিমেশন সক্রিয় করা, যাতে কোনো ভিউ-এর দৃশ্যমানতা পরিবর্তন করার সাথে সাথে একটি অ্যানিমেশন স্বয়ংক্রিয়ভাবে প্রয়োগ হয়। আরও তথ্যের জন্য, 'অটো অ্যানিমেট লেআউট আপডেট' দেখুন।
প্রপার্টি অ্যানিমেশন সিস্টেম ব্যবহার করে কীভাবে অ্যানিমেশন তৈরি করতে হয় তা জানতে, ‘ প্রপার্টি অ্যানিমেশন ওভারভিউ’ পড়ুন। এছাড়াও, সাধারণ অ্যানিমেশন তৈরি করার জন্য আপনি নিম্নলিখিত পৃষ্ঠাগুলি দেখতে পারেন:
পদার্থবিদ্যা-ভিত্তিক গতি
চিত্র ৩. ObjectAnimator দিয়ে নির্মিত অ্যানিমেশন।
চিত্র ৪. পদার্থবিদ্যা-ভিত্তিক এপিআই দিয়ে নির্মিত অ্যানিমেশন।
যখনই সম্ভব, আপনার অ্যানিমেশনগুলোতে বাস্তব জগতের পদার্থবিদ্যা প্রয়োগ করুন, যাতে সেগুলো দেখতে স্বাভাবিক লাগে। উদাহরণস্বরূপ, লক্ষ্যবস্তু পরিবর্তন হলেও সেগুলোর গতিবেগ বজায় রাখা উচিত এবং যেকোনো পরিবর্তনের সময় মসৃণ রূপান্তর ঘটানো উচিত।
এই আচরণগুলো প্রদান করার জন্য, অ্যান্ড্রয়েড সাপোর্ট লাইব্রেরিতে পদার্থবিদ্যা-ভিত্তিক অ্যানিমেশন এপিআই অন্তর্ভুক্ত রয়েছে, যা আপনার অ্যানিমেশনগুলো কীভাবে ঘটবে তা নিয়ন্ত্রণ করতে পদার্থবিজ্ঞানের নিয়মের উপর নির্ভর করে।
পদার্থবিদ্যা-ভিত্তিক দুটি প্রচলিত অ্যানিমেশন হলো নিম্নরূপ:
পদার্থবিদ্যার উপর ভিত্তি করে তৈরি নয় এমন অ্যানিমেশন—যেমন ObjectAnimator API ব্যবহার করে নির্মিত অ্যানিমেশন—বেশ স্থির প্রকৃতির এবং এগুলোর একটি নির্দিষ্ট সময়কাল থাকে। যদি টার্গেট ভ্যালু পরিবর্তিত হয়, তবে আপনাকে অবশ্যই টার্গেট ভ্যালু পরিবর্তনের মুহূর্তে অ্যানিমেশনটি বাতিল করতে হবে, নতুন স্টার্ট ভ্যালু হিসেবে একটি নতুন মান দিয়ে অ্যানিমেশনটি পুনরায় কনফিগার করতে হবে এবং নতুন টার্গেট ভ্যালুটি যোগ করতে হবে। দৃশ্যত, এই প্রক্রিয়াটি অ্যানিমেশনে একটি আকস্মিক বিরতি তৈরি করে এবং এর পরে একটি অসংলগ্ন গতি সৃষ্টি করে, যেমনটি চিত্র ৩-এ দেখানো হয়েছে।
DynamicAnimation এর মতো পদার্থবিদ্যা-ভিত্তিক অ্যানিমেশন এপিআই (API) দিয়ে তৈরি অ্যানিমেশনগুলো বল দ্বারা চালিত হয়। লক্ষ্যমাত্রার মানের পরিবর্তনের ফলে বলের পরিবর্তন ঘটে। এই নতুন বল বিদ্যমান বেগের উপর প্রয়োগ হয়, যা একটি নিরবচ্ছিন্ন রূপান্তরের মাধ্যমে নতুন লক্ষ্যে পৌঁছায়। এই প্রক্রিয়ার ফলে অ্যানিমেশনটি আরও স্বাভাবিক দেখায়, যেমনটি চিত্র ৪-এ দেখানো হয়েছে।
লেআউটের পরিবর্তনগুলি অ্যানিমেট করুন
চিত্র ৫। লেআউট পরিবর্তন করে অথবা একটি নতুন অ্যাক্টিভিটি শুরু করে আরও বিস্তারিত তথ্য দেখানোর জন্য অ্যানিমেশন তৈরি করা যেতে পারে।
অ্যান্ড্রয়েড ৪.৪ (এপিআই লেভেল ১৯) এবং এর পরবর্তী সংস্করণগুলোতে, আপনি বর্তমান অ্যাক্টিভিটি বা ফ্র্যাগমেন্টের মধ্যে লেআউট অদলবদল করার সময় অ্যানিমেশন তৈরি করতে ট্রানজিশন ফ্রেমওয়ার্ক ব্যবহার করতে পারেন। এর জন্য আপনাকে শুধু শুরুর এবং শেষের লেআউট এবং আপনি কোন ধরনের অ্যানিমেশন ব্যবহার করতে চান তা নির্দিষ্ট করে দিতে হবে। এরপর সিস্টেম নিজেই দুটি লেআউটের মধ্যে একটি অ্যানিমেশন বুঝে নিয়ে তা কার্যকর করে। এটি ব্যবহার করে আপনি সম্পূর্ণ UI অদলবদল করতে পারেন অথবা শুধু কয়েকটি ভিউ সরাতে বা প্রতিস্থাপন করতে পারেন।
উদাহরণস্বরূপ, যখন ব্যবহারকারী আরও তথ্য দেখতে কোনো আইটেমে ট্যাপ করেন, তখন আপনি চিত্র ৫-এ দেখানো ট্রানজিশনটির মতো একটি ট্রানজিশন প্রয়োগ করে লেআউটটি আইটেমের বিবরণ দিয়ে প্রতিস্থাপন করতে পারেন।
শুরু এবং শেষের লেআউট প্রতিটি একটি Scene এ সংরক্ষিত থাকে, যদিও শুরুর সিনটি সাধারণত বর্তমান লেআউট থেকে স্বয়ংক্রিয়ভাবে নির্ধারিত হয়। আপনি কী ধরনের অ্যানিমেশন চান তা সিস্টেমকে জানানোর জন্য একটি Transition তৈরি করেন, তারপর TransitionManager.go() কল করেন এবং সিস্টেম লেআউটগুলি অদলবদল করার জন্য অ্যানিমেশনটি চালায়।
আরও তথ্যের জন্য, “ট্রানজিশন ব্যবহার করে লেআউটের পরিবর্তন অ্যানিমেট করুন” পড়ুন। নমুনা কোডের জন্য, “বেসিকট্রানজিশন” দেখুন।
কার্যকলাপগুলির মধ্যে অ্যানিমেশন তৈরি করুন
অ্যান্ড্রয়েড ৫.০ (এপিআই লেভেল ২১) এবং এর পরবর্তী সংস্করণগুলোতে, আপনি এমন অ্যানিমেশনও তৈরি করতে পারেন যা আপনার অ্যাক্টিভিটিগুলোর মধ্যে ট্রানজিশন ঘটায়। এটি পূর্ববর্তী বিভাগে বর্ণিত একই ট্রানজিশন ফ্রেমওয়ার্কের উপর ভিত্তি করে তৈরি, তবে এটি আপনাকে আলাদা অ্যাক্টিভিটির লেআউটগুলোর মধ্যে অ্যানিমেশন তৈরি করার সুযোগ দেয়।
আপনি সাধারণ অ্যানিমেশন প্রয়োগ করতে পারেন, যেমন নতুন অ্যাক্টিভিটিটিকে পাশ থেকে স্লাইড করে আনা বা ধীরে ধীরে দৃশ্যমান করা, তবে আপনি এমন অ্যানিমেশনও তৈরি করতে পারেন যা প্রতিটি অ্যাক্টিভিটির মধ্যে থাকা শেয়ার্ড ভিউগুলোর মধ্যে ট্রানজিশন ঘটায়। উদাহরণস্বরূপ, যখন ব্যবহারকারী আরও তথ্য দেখার জন্য কোনো আইটেমে ট্যাপ করেন, তখন আপনি এমন একটি অ্যানিমেশনের মাধ্যমে নতুন অ্যাক্টিভিটিতে ট্রানজিশন করতে পারেন যা সেই আইটেমটিকে নির্বিঘ্নে বড় করে স্ক্রিনটি পূর্ণ করে, যেমনটি চিত্র ৫-এ দেখানো অ্যানিমেশনটিতে রয়েছে।
যথারীতি, আপনি startActivity() কল করবেন, কিন্তু এর সাথে ActivityOptions.makeSceneTransitionAnimation() দ্বারা প্রদত্ত একগুচ্ছ অপশন পাস করবেন। এই অপশনগুলোর মধ্যে অন্তর্ভুক্ত থাকতে পারে কোন ভিউগুলো অ্যাক্টিভিটিগুলোর মধ্যে শেয়ার করা হয়, যাতে ট্রানজিশন ফ্রেমওয়ার্ক অ্যানিমেশনের সময় সেগুলোকে সংযুক্ত করতে পারে।
অতিরিক্ত তথ্যের জন্য দেখুন: