เพิ่มการรองรับภาพเคลื่อนไหวของท่าทางสัมผัสย้อนกลับแบบคาดเดาในตัวและที่กำหนดเอง

หากย้ายข้อมูลแอปไปยัง API ใหม่ของระบบใหม่แล้ว คุณจะดำเนินการต่อไปนี้ได้ เลือกใช้การคาดการณ์กลับเพื่อรับในแอปโดยอัตโนมัติ ภาพเคลื่อนไหวและรองรับการเปลี่ยนที่กำหนดเอง

เพิ่มการรองรับภาพเคลื่อนไหวในแอปในตัว

วิดีโอ: การเคลื่อนไหวย้อนกลับแบบคาดเดา

หลังจากเลือกใช้แล้ว แอปจะแสดงภาพเคลื่อนไหวสำหรับการกลับไปที่หน้าแรก ข้ามกิจกรรม และข้ามงาน

นอกจากนี้ คุณยังอัปเกรดการพึ่งพาคอมโพเนนต์ของ Material เป็น v1.10.0 ของ MDC Android เพื่อรับภาพเคลื่อนไหวของคอมโพเนนต์ของ Material ดังต่อไปนี้ได้ด้วย

ดูคำแนะนำสำหรับนักพัฒนาคอมโพเนนต์ Material ใน GitHub สำหรับข้อมูลเพิ่มเติม

วิดีโอแสดงตัวอย่างสั้นๆ ของภาพเคลื่อนไหวการย้อนกลับแบบคาดการณ์สําหรับกิจกรรมข้ามแอปและการกลับไปยังหน้าจอหลักโดยใช้แอปการตั้งค่า Android

  1. ในภาพเคลื่อนไหว ผู้ใช้จะปัดกลับเพื่อกลับไปยังการตั้งค่าก่อนหน้า ตัวอย่างภาพเคลื่อนไหวข้ามกิจกรรม
  2. ตอนนี้ในหน้าจอก่อนหน้า ผู้ใช้เริ่มปัดกลับเป็นครั้งที่ 2 ซึ่งจะแสดงตัวอย่างหน้าจอหลักพร้อมวอลเปเปอร์ ซึ่งเป็นตัวอย่างของภาพเคลื่อนไหวในการกลับไปยังหน้าจอหลัก
  3. ผู้ใช้ปัดไปทางขวาต่อ แสดงภาพเคลื่อนไหวของหน้าต่างที่ยุบเป็นไอคอนบนหน้าจอหลัก
  4. ตอนนี้ผู้ใช้ได้กลับไปยังหน้าจอหลักเรียบร้อยแล้ว

อ่านเพิ่มเติมเกี่ยวกับการรองรับการแบ็กอัปตามการคาดการณ์

เพิ่มการเปลี่ยนภาพและภาพเคลื่อนไหวในแอปที่กําหนดเอง

คุณสามารถสร้างภาพเคลื่อนไหวและทรานซิชันของพร็อพเพอร์ตี้ในแอปที่กำหนดเองได้โดยใช้ Progress API และเมธอดภาพเคลื่อนไหวข้ามกิจกรรมที่กำหนดเอง overrideActivityTransition

เพิ่มทรานซิชันที่กำหนดเองโดยใช้ Progress API

เมื่อใช้ AndroidX Activity 1.8.0-alpha01 ขึ้นไป คุณจะใช้ Predictive Back Progress API เพื่อพัฒนาภาพเคลื่อนไหวที่กําหนดเองสําหรับท่าทางสัมผัสแบบคาดการณ์การย้อนกลับในแอปได้ ใน OnBackPressedCallback เราขอแนะนําวิธีการ handleOnBackProgressed, handleOnBackCancelled และ handleOnBackStarted เพื่อแสดงภาพเคลื่อนไหวของวัตถุขณะที่ผู้ใช้ปัดกลับ ใช้วิธีเหล่านี้หากต้องการอะไรที่ปรับแต่งได้มากกว่าภาพเคลื่อนไหวเริ่มต้นที่ได้จากภาพเคลื่อนไหวของระบบแบบใหม่หรือภาพเคลื่อนไหวของคอมโพเนนต์ Material

เราคาดหวังให้แอปส่วนใหญ่ใช้ AndroidX API ที่เข้ากันได้แบบย้อนหลัง แต่ก็มี API ของแพลตฟอร์มที่คล้ายกันภายใน OnBackAnimationCallback พร้อมให้ทดสอบใน Android 14 Developer Preview 1 ขึ้นไป

ใช้ Progress API กับ AndroidX Transitions

Progress API สามารถใช้กับ AndroidX Transitions 1.5.0-alpha01 ขึ้นไปใน Android 14 ขึ้นไปเพื่อสร้างการเปลี่ยนฉากแบบคาดการณ์การย้อนกลับ

  1. ใช้ TransitionManager#controlDelayedTransition แทน beginDelayedTransition เพื่อเล่นทรานซิชันเมื่อผู้ใช้ปัดกลับ
  2. ดำเนินการเปลี่ยนภายใน handleOnBackStarted
  3. เล่นการเปลี่ยนหน้าด้วยเหตุการณ์ย้อนหลังภายใน handleOnBackProgressed โดย เกี่ยวข้องกับ currentFraction กับ BackEvent.progress ซึ่งแสดงให้เห็นว่า ผู้ใช้ปัดกลับ
  4. เปลี่ยนโหมดให้เสร็จสิ้นหลังจากที่ผู้ใช้ใช้ท่าทางสัมผัสเพื่อย้อนกลับใน handleOnBackPressed
  5. สุดท้าย ให้รีเซ็ตสถานะของการเปลี่ยนแปลงภายใน handleOnBackCancelled

วิดีโอต่อไปนี้, โค้ด Kotlin และ XML แสดงการเปลี่ยนแบบกำหนดเอง ระหว่าง 2 ช่องที่ใช้งานกับ 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>

โปรดทราบสิ่งต่อไปนี้เมื่อใช้ทรานซิชัน "กลับ" ตามการคาดการณ์

  • ใช้ isSeekingSupported เพื่อตรวจสอบว่าทรานซิชันรองรับการย้อนกลับแบบคาดการณ์หรือไม่
  • ลบล้าง isSeekingSupported เพื่อแสดงผลเป็น "จริง" สำหรับทรานซิชันที่กำหนดเอง
  • สร้างตัวควบคุม 1 ตัวต่อภาพเคลื่อนไหว
  • รองรับการเปลี่ยนกลับแบบคาดเดาได้ กับการเปลี่ยนของ AndroidX แต่ไม่ใช่กับการเปลี่ยนกรอบการทำงาน เราขอแนะนำให้ย้ายข้อมูลออกจากเฟรมเวิร์ก การเปลี่ยนแปลง
  • การย้อนกลับแบบคาดเดาได้รับการสนับสนุนในอุปกรณ์ Android 14 ขึ้นไปและ เข้ากันไม่ได้แบบย้อนหลัง
  • นอกจากนี้ ระบบยังรองรับทรานซิชันที่สร้างด้วยฉาก XML ด้วย ใน handleOnBackStarted ให้ตั้งค่า TransitionSeekController เป็นผลลัพธ์ของ TransitionManager.createSeekController แทนผลลัพธ์ของ controlDelayedTransition

เพิ่มการเปลี่ยนกิจกรรมที่กำหนดเองใน Android 14 ขึ้นไป

เพื่อให้การเปลี่ยนกิจกรรมที่กำหนดเองรองรับการคาดการณ์กลับมาใช้ใน Android 14 และสูงกว่า คุณสามารถใช้ overrideActivityTransition แทน overridePendingTransition ซึ่งหมายความว่าภาพเคลื่อนไหวการเปลี่ยนจะเล่นเป็น ผู้ใช้ปัดกลับ

หากต้องการแสดงตัวอย่างของวิธีการทำงาน ให้นึกถึงสถานการณ์ที่ กิจกรรม B จะอยู่ที่ด้านบนของกิจกรรม A ในกลุ่มย้อนกลับ คุณจะต้องจัดการแบบกำหนดเอง ภาพเคลื่อนไหวของกิจกรรมในลักษณะต่อไปนี้

  • เรียกใช้ทรานซิชันเปิดหรือปิดภายในonCreate เมธอดของกิจกรรม ข.
  • เมื่อผู้ใช้ไปยังกิจกรรม ข ให้ใช้ OVERRIDE_TRANSITION_OPEN เมื่อผู้ใช้ปัดเพื่อไปยังกิจกรรม ก ให้ใช้ OVERRIDE_TRANSITION_CLOSE
  • เมื่อระบุ OVERRIDE_TRANSITION_CLOSE enterAnim คือกิจกรรม A ป้อนภาพเคลื่อนไหวและ exitAnim คือภาพเคลื่อนไหวออกจากกิจกรรม B