مقدمه‌ای بر پویانمایی‌ها

امتحان کردن روش Compose
Jetpack Compose جعبه‌ابزار واسط کاربر توصیه‌شده برای Android است. با نحوه استفاده از «پویانمایی‌ها» در Compose آشنا شوید.

پویانمایی‌ها می‌توانند نشانه‌های دیداری اضافه کنند که به کاربران اطلاع می‌دهد چه اتفاقی در برنامه شما درحال رخ دادن است. این پویانمایی‌ها به‌ویژه زمانی مفید هستند که وضعیت واسط کاربر تغییر می‌کند، مثلاً وقتی محتوای جدیدی بار می‌شود یا کنش‌های جدیدی دردسترس قرار می‌گیرد. پویانمایی‌ها همچنین ظاهری صیقلی به برنامه‌تان می‌دهند که باعث می‌شود ظاهر و احساسی با کیفیت بالاتر داشته باشد.

Android شامل میاناهای برنامه‌سازی کاربردی پویانمایی مختلفی است که به نوع پویانمایی موردنظر شما بستگی دارد. این سند نمای کلی روش‌های مختلفی را که می‌توانید به میانای کاربری‌تان حرکت اضافه کنید ارائه می‌دهد.

برای درک بهتر اینکه چه زمانی باید از پویانمایی استفاده کنید، راهنمای طراحی مواد درباره حرکت را نیز ببینید.

پویانمایی بیت‌مپ‌ها

شکل ۱. ترسیمی پویانمایی‌شده.

برای پویانمایی کردن گرافیک بیت‌مپ مثل نماد یا تصویر، از drawable animation APIs استفاده کنید. معمولاً این پویانمایی‌ها به‌صورت ایستا با منبع ترسیم‌شدنی تعریف می‌شوند، اما می‌توانید رفتار پویانمایی را در زمان اجرا نیز تعریف کنید.

برای مثال، یک روش خوب برای نشان دادن اینکه دو کنش به هم مرتبط هستند به کاربر، پویانمایی کردن دکمه پخش است که وقتی روی آن تک‌ضرب زده می‌شود به دکمه مکث تبدیل می‌شود.

برای اطلاعات بیشتر، پویانمایی گرافیک‌های قابل‌ترسیم را بخوانید.

متحرک‌سازی رؤیت‌پذیری و حرکت واسط کاربر

شکل ۲. پویانمایی ظریف هنگام ظاهر شدن و ناپدید شدن چارگوش گفتگو تغییر واسط کاربر را کمتر ناهنجار می‌کند.

وقتی لازم است نمایان بودن یا موقعیت نماها را در چیدمانتان تغییر دهید، بهتر است پویانمایی‌های ظریفی اضافه کنید تا به کاربر کمک کند نحوه تغییر میانای کاربری را درک کند.

برای جابه‌جا کردن، آشکار کردن، یا پنهان کردن نماها در چیدمان فعلی، می‌توانید از سیستم پویانمایی ویژگی ارائه‌شده توسط بسته android.animation استفاده کنید که در Android نسخه ۳.۰ (سطح میانای برنامه‌سازی کاربردی ۱۱) و بالاتر دردسترس است. این میاناهای برنامه‌سازی کاربردی ویژگی‌های اشیای View شما را درطول زمان به‌روز می‌کنند و با تغییر ویژگی‌ها، به‌طور مداوم نما را دوباره ترسیم می‌کنند. برای مثال، وقتی ویژگی‌های موقعیت را تغییر می‌دهید، نما در سراسر صفحه حرکت می‌کند. وقتی ویژگی آلفا را تغییر می‌دهید، نما محو یا ظاهر می‌شود.

برای ساده‌ترین روش ایجاد این پویانمایی‌ها، پویانمایی‌ها را در چیدمانتان فعال کنید تا وقتی رؤیت‌پذیری نمایی را تغییر می‌دهید، پویانمایی به‌طور خودکار اعمال شود. برای اطلاعات بیشتر، به‌روزرسانی‌های چیدمان پویانمایی خودکار را ببینید.

برای آشنایی با نحوه ساخت پویانمایی بااستفاده از سیستم پویانمایی ویژگی، نمای کلی پویانمایی ویژگی را بخوانید. همچنین می‌توانید برای ایجاد پویانمایی‌های رایج به صفحه‌های زیر مراجعه کنید:

حرکت مبتنی بر فیزیک

شکل ۳. پویانمایی ساخته‌شده با ObjectAnimator.

شکل ۴. پویانمایی ساخته‌شده با میاناهای برنامه‌سازی کاربردی مبتنی بر فیزیک.

هر زمان که ممکن است، فیزیک دنیای واقعی را در پویانمایی‌هایتان اعمال کنید تا طبیعی به‌نظر برسند. برای مثال، وقتی هدفشان تغییر می‌کند باید تکانه را حفظ کنند و درطول هرگونه تغییر، گذار روانی داشته باشند.

برای ارائه این رفتارها، کتابخانه «پشتیبانی Android» شامل میاناهای برنامه‌سازی کاربردی پویانمایی مبتنی بر فیزیک است که برای کنترل نحوه وقوع پویانمایی‌های شما به قوانین فیزیک متکی هستند.

دو پویانمایی رایج مبتنی بر فیزیک عبارت‌اند از:

پویانمایی‌هایی که براساس فیزیک نیستند (مثلاً پویانمایی‌هایی که با میاناهای برنامه‌سازی کاربردی ObjectAnimator ساخته شده‌اند) نسبتاً ثابت هستند و مدت ثابتی دارند. اگر مقدار هدف تغییر کند، باید پویانمایی را در زمان تغییر مقدار هدف لغو کنید، پویانمایی را با مقدار جدید به‌عنوان مقدار شروع جدید پیکربندی کنید، و مقدار هدف جدید را اضافه کنید. ازنظر بصری، این فرایند باعث توقف ناگهانی در پویانمایی و حرکت ازهم‌گسیخته پس‌از آن می‌شود، همان‌طور که در شکل ۳ نشان داده شده است.

پویانمایی‌هایی که با میاناهای برنامه‌سازی کاربردی پویانمایی مبتنی بر فیزیک، مثل DynamicAnimation، ساخته شده‌اند، با نیرو هدایت می‌شوند. تغییر در مقدار هدف منجر به تغییر در نیرو می‌شود. نیروی جدید بر سرعت موجود اعمال می‌شود که باعث انتقال مداوم به هدف جدید می‌شود. این فرایند منجر به پویانمایی طبیعی‌تری می‌شود، همان‌طور که در شکل ۴ نشان داده شده است.

پویانمایی تغییرات چیدمان

شکل ۵. پویانمایی برای نشان دادن جزئیات بیشتر را می‌توان با تغییر چیدمان یا شروع فعالیت جدید به‌دست آورد.

در Android 4.4 (سطح میانای برنامه‌سازی کاربردی ۱۹) و بالاتر، می‌توانید از چارچوب انتقال برای ایجاد پویانمایی هنگام جابه‌جایی چیدمان در فعالیت یا قطعه فعلی استفاده کنید. تنها کاری که باید انجام دهید این است که چیدمان شروع و پایان و نوع پویانمایی‌ای را که می‌خواهید استفاده کنید مشخص کنید. سپس سیستم پویانمایی‌ای را بین دو چیدمان محاسبه و اجرا می‌کند. می‌توانید از این برای جابه‌جا کردن کل واسط کاربر یا برای جابه‌جا کردن یا جایگزین کردن فقط برخی‌از نماها استفاده کنید.

برای مثال، وقتی کاربر روی موردی تک‌ضرب می‌زند تا اطلاعات بیشتری ببیند، می‌توانید چیدمان را با جزئیات مورد جایگزین کنید و انتقالی مانند آنچه در شکل ۵ نشان داده شده است اعمال کنید.

چیدمان شروع و پایان هرکدام در یک Scene ذخیره می‌شوند، اگرچه صحنه شروع معمولاً به‌طور خودکار از چیدمان فعلی تعیین می‌شود. شما یک Transition ایجاد می‌کنید تا به سیستم بگویید چه نوع پویانمایی‌ای می‌خواهید، سپس TransitionManager.go() را فراخوانی می‌کنید و سیستم پویانمایی را برای جابه‌جایی طرح‌بندی‌ها اجرا می‌کند.

برای اطلاعات بیشتر، پویانمایی تغییرات چیدمان بااستفاده از انتقال را بخوانید. برای کد نمونه، BasicTransition را بررسی کنید.

پویانمایی بین فعالیت‌ها

در Android نسخه ۵.۰ (سطح میانای برنامه‌سازی کاربردی ۲۱) و بالاتر، می‌توانید پویانمایی‌هایی ایجاد کنید که بین فعالیت‌هایتان انتقال ایجاد کند. این روش براساس همان چارچوب انتقال شرح‌داده‌شده در بخش قبلی است، اما به شما امکان می‌دهد بین چیدمان‌ها در فعالیت‌های جداگانه پویانمایی ایجاد کنید.

می‌توانید پویانمایی‌های ساده‌ای مانند لغزاندن فعالیت جدید از کنار یا محو کردن آن اعمال کنید، اما همچنین می‌توانید پویانمایی‌هایی ایجاد کنید که بین نماهای مشترک در هر فعالیت جابه‌جا شوند. برای مثال، وقتی کاربر روی موردی تک‌ضرب می‌زند تا اطلاعات بیشتری ببیند، می‌توانید با پویانمایی‌ای که به‌طور یکپارچه آن مورد را بزرگ می‌کند تا صفحه را پر کند، به فعالیت جدیدی منتقل شوید، مانند پویانمایی نشان‌داده‌شده در شکل ۵.

طبق معمول، startActivity() را فراخوانی می‌کنید، اما مجموعه‌ای از گزینه‌های ارائه‌شده توسط ActivityOptions.makeSceneTransitionAnimation() را به آن ارسال می‌کنید. این بسته گزینه‌ها ممکن است شامل نماهایی باشد که بین فعالیت‌ها هم‌رسانی می‌شوند تا چارچوب انتقال بتواند آن‌ها را درطول پویانمایی متصل کند.

برای منابع بیشتر، به موارد زیر مراجعه کنید: