ตั้งค่าการย้อนกลับที่คาดการณ์ได้

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

ภาพเคลื่อนไหวของการย้อนกลับที่คาดการณ์ได้เพื่อกลับไปที่หน้าแรก
ภาพเคลื่อนไหวข้ามกิจกรรมที่คาดการณ์ได้
ภาพเคลื่อนไหวข้ามงานแบบคาดการณ์

เปิดใช้ภาพเคลื่อนไหวของระบบเริ่มต้น

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

  • กลับไปที่หน้าแรก: นำผู้ใช้กลับไปที่หน้าจอหลัก
  • ข้ามกิจกรรม: การเปลี่ยนผ่านระหว่างกิจกรรมภายในแอป
  • ข้ามงาน: การเปลี่ยนระหว่างงาน

โดยค่าเริ่มต้น ระบบจะเปิดใช้ภาพเคลื่อนไหวเหล่านี้ใน Android 15 ขึ้นไป ในอุปกรณ์ที่ใช้ Android 13 หรือ 14 ผู้ใช้จะเปิดใช้ได้ผ่านตัวเลือกสำหรับนักพัฒนาแอป

หากต้องการรับภาพเคลื่อนไหวของระบบ ให้อัปเดตActivityทรัพยากร Dependency AndroidX เป็น1.6.0 ขึ้นไป

เปิดใช้การย้อนกลับที่คาดการณ์ได้ด้วย Navigation Compose

หากต้องการใช้การย้อนกลับที่คาดการณ์ได้ใน Navigation Compose ให้ตรวจสอบว่าคุณใช้ไลบรารี navigation-compose 2.8.0 ขึ้นไป

Navigation Compose จะเปลี่ยนฉากระหว่างหน้าจอโดยอัตโนมัติเมื่อผู้ใช้ ปัดกลับ

รูปที่ 2 ภาพเคลื่อนไหวการเปลี่ยนฉากแบบครอสเฟดเริ่มต้นในแอป SociaLite

เมื่อไปยังส่วนต่างๆ คุณจะสร้างทรานซิชันที่กำหนดเองได้ด้วย popEnterTransition และ popExitTransition เมื่อใช้กับ NavHost ตัวแก้ไขเหล่านี้จะช่วยให้คุณกำหนดวิธีที่หน้าจอเข้าและออก เคลื่อนไหวได้ คุณสามารถใช้เพื่อสร้างเอฟเฟกต์ต่างๆ เช่น การปรับขนาด การจาง หรือการเลื่อน

ในตัวอย่างนี้ เราใช้ scaleOut ภายใน popExitTransition เพื่อลดขนาด หน้าจอที่ออกจากแอปเมื่อผู้ใช้ย้อนกลับ นอกจากนี้ พารามิเตอร์ transformOrigin ยังกำหนดจุดที่เกิดภาพเคลื่อนไหวการปรับขนาด ด้วย โดยค่าเริ่มต้นคือตรงกลางหน้าจอ (0.5f, 0.5f) คุณปรับค่านี้เพื่อให้การปรับขนาดมาจากจุดอื่นได้

NavHost(
    navController = navController,
    startDestination = Home,
    popExitTransition = {
        scaleOut(
            targetScale = 0.9f,
            transformOrigin = TransformOrigin(pivotFractionX = 0.5f, pivotFractionY = 0.5f)
        )
    },
    popEnterTransition = {
        EnterTransition.None
    },
    modifier = modifier,
)

โค้ดนี้จะสร้างผลลัพธ์ต่อไปนี้

รูปที่ 3 ภาพเคลื่อนไหวในแอปที่กำหนดเองใน SociaLite

popEnterTransition และ popExitTransition จะควบคุมภาพเคลื่อนไหวโดยเฉพาะ เมื่อแสดงผล Back Stack ด้วยท่าทางสัมผัสย้อนกลับ เป็นต้น นอกจากนี้ คุณยังใช้ enterTransition และ exitTransition เพื่อกำหนดภาพเคลื่อนไหวสำหรับการเข้าและ ออกจาก Composable โดยทั่วไปได้ด้วย ไม่ใช่เฉพาะสำหรับการย้อนกลับที่คาดการณ์ได้เท่านั้น หากคุณตั้งค่าเฉพาะ enterTransition และ exitTransition ระบบจะใช้ค่าดังกล่าวทั้งสำหรับการนำทางปกติและการป๊อป Back Stack อย่างไรก็ตาม การใช้ popEnterTransition และ popExitTransition จะช่วยให้คุณสร้างภาพเคลื่อนไหวที่แตกต่างกันสำหรับการนำทางย้อนกลับได้

ผสานรวมกับการเปลี่ยนภาพองค์ประกอบแบบใช้ร่วมกัน

การเปลี่ยนองค์ประกอบที่ใช้ร่วมกันจะสร้างการเชื่อมต่อภาพที่ราบรื่นระหว่าง Composables ที่มีเนื้อหาร่วมกัน ซึ่งมักใช้สำหรับการนำทาง

รูปที่ 4 การเปลี่ยนองค์ประกอบแบบใช้ร่วมกันด้วยการย้อนกลับที่คาดการณ์ได้ใน Navigation Compose

หากต้องการใช้ Shared Element กับ Navigation Compose โปรดดู การย้อนกลับที่คาดการณ์ได้พร้อม Shared Element

รองรับการย้อนกลับที่คาดการณ์ได้ด้วยคอมโพเนนต์ Material Compose

คอมโพเนนต์หลายรายการในไลบรารี Material Compose ได้รับการออกแบบมาให้ทำงานได้อย่างราบรื่น ด้วยท่าทางสัมผัสย้อนกลับแบบคาดการณ์ หากต้องการเปิดใช้ภาพเคลื่อนไหวการย้อนกลับที่คาดการณ์ได้ในคอมโพเนนต์เหล่านี้ ให้รวมทรัพยากร Dependency Material3 ล่าสุด (androidx.compose.material3:material3-*:1.3.0 ขึ้นไป) ไว้ในโปรเจ็กต์

คอมโพเนนต์ Material ที่รองรับภาพเคลื่อนไหวของการย้อนกลับที่คาดการณ์ได้มีดังนี้

SearchBar และ ModalBottomSheet จะเคลื่อนไหวโดยอัตโนมัติด้วย ท่าทางสัมผัสย้อนกลับแบบคาดเดา ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet และ DismissibleNavigationDrawer กำหนดให้คุณส่ง drawerState ไปยัง เนื้อหาชีตที่เกี่ยวข้องที่สามารถเขียนได้

ทดสอบภาพเคลื่อนไหวของท่าทางสัมผัสการย้อนกลับที่คาดการณ์ได้

หากยังใช้ Android 13 หรือ Android 14 อยู่ คุณสามารถทดสอบภาพเคลื่อนไหวกลับไปหน้าแรกได้

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

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

ใน Android 15 ขึ้นไป ฟีเจอร์นี้จะเปิดใช้อยู่โดยค่าเริ่มต้น

แหล่งข้อมูลเพิ่มเติม