Yerleşik ve özel tahmine dayalı geri animasyonlar için destek ekleme

Uygulamanızı yeni sistem geri API'lerine taşıdıysanız uygulama içi animasyonları otomatik olarak almak ve özel geçişleri desteklemek için tahmini geri özelliğini etkinleştirebilirsiniz.

Yerleşik uygulama içi animasyonlar için destek ekleme

Video: Tahmine dayalı geri hareketi animasyonları

Bu özelliği etkinleştirdikten sonra uygulamanız, ana ekrana dönme, etkinlik ve görevler arası geçiş animasyonlarını gösterir.

Aşağıdaki gibi materyal bileşen animasyonlarını almak için materyal bileşeni bağımlılığınızı MDC Android'in 1.10.0 sürümüne de yükseltebilirsiniz:

Daha fazla bilgi için GitHub'daki materyal bileşeni geliştirici kılavuzuna bakın.

Bu videoda, şunun için tahmini geri animasyonlara dair kısa bir örnek çapraz etkinlik ve ana sayfaya geri dönme özelliklerini kullanabilirsiniz.

  1. Kullanıcı animasyonda önceki ayarlara dönmek için ekranı geri kaydırır ekranı gibi gösterilir.
  2. Kullanıcı, önceki ekranda ikinci kez geri kaydırmaya başlar. Bu sırada, ana ekranın duvar kağıdıyla birlikte önizlemesi gösterilir. Bu, ana ekrana geri dönme animasyonuna örnektir.
  3. Kullanıcı, ekranı sağa kaydırmaya devam ederek pencerenin animasyonu gösterilir ana ekrandaki simgeye küçültülür.
  4. Kullanıcı artık ana ekrana tamamen geri döndü.

Tahmini geri ödemeyi destekleme hakkında daha fazla bilgi edinin.

Özel uygulama içi geçişler ve animasyonlar ekleme

Özel uygulama içi mülk animasyonları ve geçişleri oluşturmak için Progress API ve özel etkinlikler arası animasyonlar yöntemi overrideActivityTransition

Progress API'yi kullanarak özel geçişler ekleme

AndroidX Activity 1.8.0-alpha01 veya sonraki sürümlerde, uygulamanızda tahmini geri hareketi için özel animasyonlar geliştirmek üzere Tahmini Geri İlerleme API'lerini kullanabilirsiniz. OnBackPressedCallback sürümünde, kullanıcı geri kaydırırken nesneleri canlandırmak için handleOnBackProgressed, handleOnBackCancelled ve handleOnBackStarted yöntemlerini kullanıma sunduk. Tekliflerinizi otomatikleştirmek ve optimize etmek için varsayılan animasyonlardan daha özel bir şeye ihtiyacınız varsa bu yöntemleri kullanabilirsiniz. yeni sistem animasyonları veya Malzeme Bileşeni animasyonları tarafından sağlanan şemadır.

Çoğu uygulamanın geriye dönük uyumlu AndroidX API'lerini kullanmasını bekleriz. Bununla birlikte, Android 14 Geliştirici Önizlemesi 1 ve sonraki sürümlerde test edebileceğiniz OnBackAnimationCallback arayüzünde benzer platform API'leri de vardır.

AndroidX geçişleriyle Progress API'leri kullanma

İlerleme API'leri, Android 14 ve sonraki sürümlerde Tahmini Geri geçişleri oluşturmak için AndroidX Geçişler 1.5.0-alpha01 veya sonraki sürümlerle kullanılabilir.

  1. Kullanıcı geri kaydırdığında geçişleri oynatmak için beginDelayedTransition yerine TransitionManager#controlDelayedTransition kullanın.
  2. Geçişi handleOnBackStarted içinde oluşturun.
  3. Geçişi, handleOnBackProgressed içinde önceki etkinliğiyle birlikte oynatın. currentFraction ile BackEvent.progress arasındaki ilişki, ne kadar uzak olduğunu Kullanıcı geri kaydırır.
  4. Kullanıcı handleOnBackPressed'te geri hareketini tamamladıktan sonra geçişi tamamlayın.
  5. Son olarak, handleOnBackCancelled içinde geçişin durumunu sıfırlayın.

Aşağıdaki video, Kotlin kodu ve XML, OnBackPressedCallback ile uygulanan iki kutu arasında özel bir geçişi göstermektedir:

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>

Tahmini Geri geçiş geçişleriyle çalışırken aşağıdakilere dikkat edin:

  • Geçişin Tahmini Geri özelliğini destekleyip desteklemediğini kontrol etmek için isSeekingSupported simgesini kullanın.
  • Özel geçişlerinizin doğru değerine döndürülmesi için isSeekingSupported değerini geçersiz kılın.
  • Her animasyon için bir denetleyici oluşturun.
  • Tahmine dayalı geri geçişler, AndroidX geçişlerinde desteklenir. ancak çerçeve geçişlerinde geçerli değil. Çerçeveden başka bir sisteme geçiş yapmanızı öneririz oluşturabilirsiniz.
  • Tahmini Geri geçişleri Android 14 ve sonraki sürümlerde desteklenir ve geriye dönük uyumlu değildir.
  • XML sahneleriyle oluşturulan geçişler de desteklenir. İçinde handleOnBackStarted, TransitionSeekController metriğinizi bu sonuç için ayarlayın Şunun sonucu yerine TransitionManager.createSeekController: controlDelayedTransition.

Android 14 ve sonraki sürümlerde özel etkinlik geçişleri ekleme

Özel etkinlik geçişlerinin Android 14 ve sonraki sürümlerde tahmini geri özelliğini desteklemesini sağlamak için overridePendingTransition yerine overrideActivityTransition kullanabilirsiniz. Bu, kullanıcı geri kaydırdığı sırada geçiş animasyonunun oynatılacağı anlamına gelir.

Bunun nasıl işleyebileceğine dair bir örnek vermek için arka yığınta B etkinliğinin A etkinliğinin üzerinde olduğu bir senaryo düşünün. Özel etkinlik animasyonları aşağıdaki şekilde ele alınır:

  • B Etkinliği'nin onCreate içinde açma veya kapatma geçişlerini çağırın yöntemidir.
  • Kullanıcı B etkinliğine gittiğinde OVERRIDE_TRANSITION_OPEN değerini kullanın. Kullanıcı A etkinliğine geri gitmek için ekranı kaydırdığında OVERRIDE_TRANSITION_CLOSE öğesini kullanın.

  • OVERRIDE_TRANSITION_CLOSE belirtilirken enterAnim, A Etkinliği'nin animasyonu girin ve exitAnim, B Etkinliği'nin çıkış animasyonudur.