اضافه کردن پشتیبانی از انیمیشن های پیشگویانه

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

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

همچنین می‌توانید وابستگی کامپوننت متریال خود را به نسخه ۱.۱۰.۰ از MDC Android ارتقا دهید تا انیمیشن‌های کامپوننت متریال مانند زیر را دریافت کنید:

• ورق‌های پایینی
• ورق‌های جانبی
• جستجو

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

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

1. در این انیمیشن، کاربر برای بازگشت به صفحه تنظیمات قبلی، انگشت خود را به عقب می‌کشد - نمونه‌ای از یک انیمیشن میان‌فعالیتی.
2. حالا در صفحه قبلی، کاربر برای بار دوم شروع به کشیدن انگشت به عقب می‌کند و پیش‌نمایشی از صفحه اصلی به همراه تصویر زمینه‌اش را نشان می‌دهد - نمونه‌ای از انیمیشن بازگشت به خانه.
3. کاربر همچنان به سمت راست سوایپ می‌کند و انیمیشنی از کوچک شدن پنجره به سمت آیکون روی صفحه اصلی نمایش داده می‌شود.
4. کاربر اکنون به طور کامل به صفحه اصلی بازگشته است.

درباره نحوه افزودن پشتیبانی از حرکات پیش‌بینی‌کننده بازگشت بیشتر بدانید.

اضافه کردن انتقال‌ها و انیمیشن‌های سفارشی درون برنامه‌ای

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

اضافه کردن انتقال‌های سفارشی با استفاده از Progress API

با AndroidX Activity 1.8.0-alpha01 یا بالاتر، می‌توانید از APIهای Predictive Back Progress برای توسعه انیمیشن‌های سفارشی برای ژست پیش‌بینی‌کننده بازگشت در برنامه خود استفاده کنید. APIهای Progress در متحرک‌سازی نماها مفید هستند، اما هنگام متحرک‌سازی انتقال بین قطعات، محدودیت‌هایی دارند. در OnBackPressedCallback متدهای handleOnBackProgressed ، handleOnBackCancelled و handleOnBackStarted برای متحرک‌سازی اشیاء در حین کشیدن انگشت کاربر به عقب معرفی کرده‌ایم. اگر نیاز به سفارشی‌سازی بیش از انیمیشن‌های پیش‌فرض ارائه شده توسط سیستم یا انیمیشن‌های کامپوننت متریال دارید، از این متدها استفاده کنید.

ما انتظار داریم که اکثر برنامه‌ها از APIهای سازگار با نسخه‌های قبلی AndroidX استفاده کنند، اما APIهای پلتفرم مشابهی نیز در رابط کاربری OnBackAnimationCallback وجود دارند که برای آزمایش در پیش‌نمایش توسعه‌دهندگان اندروید ۱۴ نسخه ۱ و بالاتر در دسترس هستند.

استفاده از APIهای پیشرفت با AndroidX Transitions

APIهای Progress می‌توانند با AndroidX Transitions 1.5.0-alpha01 یا بالاتر در اندروید ۱۴ و بالاتر برای ایجاد گذارهای Predictive Back استفاده شوند.

1. برای پخش انتقال‌ها هنگام کشیدن انگشت کاربر به عقب، به جای beginDelayedTransition از TransitionManager#controlDelayedTransition استفاده کنید.
2. انتقال را درون handleOnBackStarted ایجاد کنید.
3. با مرتبط کردن currentFraction به BackEvent.progress که میزان حرکت کاربر به عقب را نشان می‌دهد، انتقال را با رویداد back درون handleOnBackProgressed اجرا کنید.
4. پس از اینکه کاربر حرکت برگشت را در handleOnBackPressed انجام داد، انتقال را پایان دهید.
5. در نهایت، وضعیت انتقال را درون handleOnBackCancelled بازنشانی کنید.

ویدیوی زیر، کد کاتلین و XML، یک انتقال سفارشی بین دو کادر را که با OnBackPressedCallback پیاده‌سازی شده‌اند، نشان می‌دهند:

    class MyFragment : Fragment() {

    val transitionSet = TransitionSet().apply {
        addTransition(Fade(Fade.MODE_OUT))
        addTransition(ChangeBounds())
        addTransition(Fade(Fade.MODE_IN))
    }
    ...
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val callback = object : OnBackPressedCallback(enabled = false) {

            var controller: TransitionSeekController? = null

            @RequiresApi(34)
            override fun handleOnBackStarted(backEvent: BackEvent) {
                // Create the transition
                controller = TransitionManager.controlDelayedTransition(
                    binding.card,
                    transitionSet
                )
                changeTextVisibility(ShowText.SHORT)
            }

            @RequiresApi(34)
            override fun handleOnBackProgressed(backEvent: BackEvent) {
                // Play the transition as the user swipes back
                if (controller?.isReady == true) {
                    controller?.currentFraction = backEvent.progress
                }
            }

            override fun handleOnBackPressed() {
                // Finish playing the transition when the user commits back
                controller?.animateToEnd()
                this.isEnabled = false
            }

            @RequiresApi(34)
            override fun handleOnBackCancelled() {
                // If the user cancels the back gesture, reset the state
                transition(ShowText.LONG)
            }
        }

        binding.shortText.setOnClickListener {
            transition(ShowText.LONG)
            callback.isEnabled = true
        }

        this.requireActivity().onBackPressedDispatcher.addCallback(callback)
    }

    private fun transition(showText: ShowText) {
        TransitionManager.beginDelayedTransition(
            binding.card,
            transitionSet
        )
        changeTextVisibility(showText)
    }

    enum class ShowText { SHORT, LONG }
    private fun changeTextVisibility(showText: ShowText) {
        when (showText) {
            ShowText.SHORT -> {
                binding.shortText.isVisible = true
                binding.longText.isVisible = false
            }
            ShowText.LONG -> {
                binding.shortText.isVisible = false
                binding.longText.isVisible = true
            }
        }
    }
}
  

<?xml version="1.0" encoding="utf-8"?>
...
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/card"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        ...>

        <TextView
            android:id="@+id/short_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            ... />

        <TextView
            android:id="@+id/long_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:visibility="gone"
            .../>

    </androidx.constraintlayout.widget.ConstraintLayout>

هنگام کار با انتقال‌های Predictive Back، موارد زیر را در نظر داشته باشید:

• برای بررسی اینکه آیا گذار از Predictive Back پشتیبانی می‌کند یا خیر، از isSeekingSupported استفاده کنید.
• برای برگرداندن مقدار true در انتقال‌های سفارشی شما، isSeekingSupported نادیده بگیرید.
• برای هر انیمیشن یک کنترلر ایجاد کنید.
• انتقال‌های پیش‌بینانه‌ی Back با انتقال‌های AndroidX پشتیبانی می‌شوند، اما با انتقال‌های چارچوب پشتیبانی نمی‌شوند. از انتقال‌های چارچوب مهاجرت کنید و به جای آن از انتقال‌های Animator و AndroidX استفاده کنید.
• انتقال‌های پیش‌بینی‌کننده‌ی بازگشت (Predictive Back) در دستگاه‌هایی که اندروید ۱۴ و بالاتر دارند پشتیبانی می‌شوند و با نسخه‌های قبلی سازگار نیستند.
• انتقال‌های ایجاد شده با صحنه‌های XML نیز پشتیبانی می‌شوند. در handleOnBackStarted ، TransitionSeekController خود را به جای نتیجه controlDelayedTransition روی نتیجه TransitionManager.createSeekController تنظیم کنید.

اضافه کردن انتقال‌های فعالیت سفارشی در اندروید ۱۴ و بالاتر

برای اطمینان از اینکه انتقال‌های سفارشی Activity از Predictive Back در اندروید ۱۴ و بالاتر پشتیبانی می‌کنند، می‌توانید به جای overridePendingTransition از overrideActivityTransition استفاده کنید. این بدان معناست که انیمیشن انتقال با کشیدن انگشت کاربر به عقب پخش می‌شود.

برای ارائه مثالی از نحوه عملکرد این روش، سناریویی را تصور کنید که در آن فعالیت B روی فعالیت A در back stack قرار دارد. شما می‌توانید انیمیشن‌های سفارشی Activity را به روش زیر مدیریت کنید:

• انتقال‌های آغازین یا پایانی را درون متد onCreate مربوط به Activity B فراخوانی کنید.
• وقتی کاربر به فعالیت B می‌رود، از OVERRIDE_TRANSITION_OPEN استفاده کنید. وقتی کاربر برای بازگشت به فعالیت A انگشت خود را روی صفحه می‌کشد، از OVERRIDE_TRANSITION_CLOSE استفاده کنید.

• هنگام تعیین OVERRIDE_TRANSITION_CLOSE ، enterAnim انیمیشن ورود به فعالیت A و exitAnim انیمیشن خروج از فعالیت B است.

اضافه کردن پشتیبانی برای بازگشت پیش‌بینی‌شده با قطعات

هنگام پیاده‌سازی Predictive Back با فرگمنت‌ها، دو رویکرد وجود دارد.

استفاده از API های موجود

توصیه می‌کنیم از APIهای موجود استفاده کنید. این APIها به شما امکان می‌دهند با کشیدن انگشت از لبه صفحه، انتقال‌های Animator یا Androidx خود را با استفاده از حرکت دست، دستکاری کنید. اینکه حرکت را از یک آستانه عبور دهید، مشخص می‌کند که آیا کامل شده و به قطعه قبلی برمی‌گردید، یا لغو شده و در قطعه فعلی باقی می‌مانید. برای اطلاعات بیشتر، به بخش «پیمایش بین قطعات با استفاده از انیمیشن‌ها» مراجعه کنید.

عوامل زیر را در نظر داشته باشید:

• Transitions نسخه ۱.۵.۰ یا بالاتر و Fragments نسخه ۱.۷.۰ یا بالاتر را وارد کنید. بخش عمده‌ای از پشتیبانی از back پیش‌بینی‌کننده در Fragments به توانایی Transitions در جستجوی انیمیشن‌ها بستگی دارد، که فقط در Transitions نسخه ۱.۵.۰ یا بالاتر امکان‌پذیر است.
• از Fragments، به همراه FragmentManager یا کامپوننت Navigation ، برای مدیریت back stack استفاده کنید. اگر back stack خودتان را مدیریت می‌کنید، Predictive Back پشتیبانی نمی‌شود. از back stackهایی که FragmentManager از آنها اطلاعی ندارد، مهاجرت کنید.
• برخی از کتابخانه‌ها از Predictive Back پشتیبانی می‌کنند. برای اطمینان، مستندات را بررسی کنید.
• کلاس Animator و کتابخانه AndroidX Transition پشتیبانی می‌شوند.
• کلاس Animation و کتابخانه‌ی فریم‌ورک Transition پشتیبانی نمی‌شوند.
• انیمیشن‌های پیش‌بینی‌کننده فقط روی دستگاه‌هایی کار می‌کنند که اندروید ۱۴ یا بالاتر دارند.

در موقعیت‌های زیر از back-fragments پیش‌بینی‌کننده استفاده کنید:

• کامپوننت ناوبری را متحرک‌سازی کنید .
• با setCustomAnimations متحرک‌سازی کنید.
• انتقال‌های ورود و خروج را با استفاده از setEnterTransition ، setExitTransition ، setReenterTransition و setReturnTransition متحرک‌سازی کنید.
• انتقال عناصر مشترک را با setSharedElementEnterTransition و setSharedElementReturnTransition متحرک‌سازی کنید.

برخی از حرکات مواد از نسخه ۱.۱۲.۰۲-alpha02 یا بالاتر، از جمله MaterialFadeThrough ، MaterialSharedAxis و MaterialFade از قابلیت پیش‌بینی بازگشت پشتیبانی می‌کنند.

از فراخوانی‌های برگشتی استفاده کنید

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

یک OnBackPressedCallback ایجاد کنید. درون handleOnBackProgressed ، قطعه کد را تغییر اندازه و مقیاس دهید. سپس آن را از پشته (back stack) خارج کنید. در مرحله بعد، انتقال عنصر مشترک را با استفاده از setSharedElementReturnTransition خارج از تابع فراخوانی اجرا کنید.

برای اطلاعات بیشتر، به نمونه کد در GitHub مراجعه کنید.

الزامات

از جدول زیر برای درک آنچه که توسط targetSdkVersion و compileSdkVersion کنترل می‌شود، نسخه دستگاه، وابستگی‌ها، پرچم‌های manifest و پرچم‌های fragment استفاده کنید. این جدول به الزامات کد اشاره دارد.

منابع اضافی

• نمونه‌های کد برگشتی پیش‌بینی‌کننده
• اصول اولیه برای فیلمبرداری از پشت سیستم
• ساختن برای آینده‌ی ویدیوی اندروید