Back Press Handling ใน Android: สาระสำคัญ กลไก และการนำไปใช้

Back Press Handling คืออะไร

Back Press Handling เป็นกลไกระบบใน Android ที่กำหนดว่าจะเกิดอะไรขึ้นเมื่อผู้ใช้กดปุ่มย้อนกลับแบบฮาร์ดแวร์หรือซอฟต์แวร์ ขึ้นอยู่กับบริบท การกดสามารถ: ปิดหน้าจอปัจจุบันและกลับไปยังหน้าจอก่อนหน้า ซ่อนคีย์บอร์ด ปิด Drawer หรือ Bottom Sheet ออกจากแอปหากผู้ใช้อยู่ที่หน้าจอหลัก

พฤติกรรมของปุ่มย้อนกลับได้ วิวัฒนาการไปตามแต่ละเวอร์ชันของ Android Android 10 นำการนำทางด้วยท่าทางมาใช้ Android 11 นำ OnBackPressedDispatcher มาเป็น API มาตรฐาน และ Android 13 นำการสนับสนุน predictive back gesture ที่ดีขึ้นมา โดยระบบจะแสดงภาพเคลื่อนไหวการเปลี่ยนภาพก่อนที่การดำเนินการจะเกิดขึ้นจริง Google กำลังก้าวไปสู่พฤติกรรม Back Press ที่คาดเดาได้และสอดคล้องกันในทุกอุปกรณ์อย่างต่อเนื่อง

การจัดการปุ่มย้อนกลับอย่างถูกต้องเป็น องค์ประกอบ UX ที่สำคัญ ในแอป Android ผู้ใช้คาดหวังว่าการกดย้อนกลับจะพาพวกเขากลับไปยังหน้าจอก่อนหน้าในสแต็กการนำทาง ไม่ใช่ปิดแอปโดยไม่คาดคิด การละเมิดความคาดหวังนี้เป็นหนึ่งในสาเหตุหลักของรีวิวเชิงลบและการให้คะแนนต่ำใน Google Play

วิวัฒนาการของ Back Press API: จาก onBackPressed สู่ OnBackPressedDispatcher

ประวัติศาสตร์ของ Back Press API ใน Android สะท้อนถึงวิวัฒนาการโดยรวมของแพลตฟอร์ม: จากเมธอดง่ายๆ ใน Activity สู่ระบบ callback ที่ยืดหยุ่นพร้อมการสนับสนุนวงจรชีวิตและ Compose มาดูสามขั้นตอนของการพัฒนา

ยุคของ onBackPressed (API Level 1–30)

ตั้งแต่ Android API แรกสุด ปุ่มย้อนกลับถูกจัดการใน เมธอด onBackPressed ของคลาส Activity นักพัฒนาจะโอเวอร์ไรด์เมธอดนี้และเขียนตรรกะของตนเอง ปัญหาคือ Fragment และ View ไม่สามารถสกัดกั้นการกดได้ — การควบคุมทั้งหมดผ่าน Activity สิ่งนี้นำไปสู่ Activity ที่พองตัวและห่วงโซ่ if-else ที่ซับซ้อนเพื่อกำหนดว่าใครควรจัดการการกด

การมาถึงของ OnBackPressedDispatcher (Activity 1.0.0)

ด้วย Activity 1.0.0 (AndroidX) Google ได้แนะนำ OnBackPressedDispatcher นี่คือตัวจัดส่งกลางที่ยอมรับ callback จากคอมโพเนนต์ใดๆ — Activity, Fragment, Dialog, View ที่กำหนดเอง Callback ลงทะเบียนตามลำดับ (ผ่าน priority) และสามารถเพิ่มหรือลบได้แบบไดนามิก OnBackPressedDispatcher ถูกเรียกก่อน onBackPressed เดิม ซึ่งช่วยให้สกัดกั้นการกดก่อนที่ Activity จะจัดการ

Predictive Back Gesture (Android 13+)

Android 13 นำ predictive back gesture — ภาพเคลื่อนไหวของระบบที่แสดงว่าการกดย้อนกลับจะนำไปที่ใดก่อนที่ผู้ใช้จะทำท่าทางเสร็จสมบูรณ์ เพื่อรองรับภาพเคลื่อนไหวนี้ นักพัฒนาต้องใช้ OnBackPressedDispatcher และระบุว่า callback รองรับภาพเคลื่อนไหวของระบบผ่านคุณสมบัติ isEnabled หรือไม่ หาก callback ไม่รองรับ predictive animation ระบบจะแสดงภาพเคลื่อนไหวเริ่มต้นซึ่งอาจไม่ตรงกับบริบทของแอป

OnBackPressedDispatcher — สถาปัตยกรรมและห่วงโซ่ callback

OnBackPressedDispatcher เป็นแกนหลักของ Back Press API ใหม่ มันจัดการห่วงโซ่ของ callback โดยเรียกตามลำดับจนกว่าตัวแรกจะจัดการเหตุการณ์ หากไม่มี callback ใดจัดการการกด ตัวจัดส่งจะดำเนินการเริ่มต้น — เรียก finish() สำหรับ Activity หรือ popBackStack() สำหรับ Navigation Component

การลงทะเบียน callback ด้วยลำดับความสำคัญ

Callback ลงทะเบียนผ่าน addCallback พร้อมกับ LifecycleOwner และออบเจ็กต์ OnBackPressedCallback Callback มีคุณสมบัติ isEnabled — หากตั้งค่าเป็น false callback จะถูกข้าม สำหรับลำดับความสำคัญ คุณสามารถส่งค่าจาก 0 (ต่ำสุด) ถึง Integer.MAX_VALUE Fragment Activity Result API ใช้กลไกนี้สำหรับการลงทะเบียน callback อัตโนมัติที่ผูกกับวงจรชีวิต

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val callback = object : OnBackPressedCallback(enabled = true) {
        override fun handleOnBackPressed() {
            if (isDrawerOpen) { closeDrawer() }
            else { isEnabled = false; onBackPressed() }
        }
    }
    onBackPressedDispatcher.addCallback(this, callback)
}

การทำความสะอาดแบบ Lifecycle-aware

Callback จะ ถูกลบโดยอัตโนมัติ เมื่อ LifecycleOwner เปลี่ยนไปยังสถานะ DESTROYED ซึ่งช่วยแก้ปัญหาการรั่วไหลของ callback เมื่อหมุนหน้าจอ หากเพิ่ม callback ใน Fragment จะรับประกันว่าจะถูกลบเมื่อ Fragment ถูกทำลาย สำหรับการปิดใช้งาน callback ชั่วคราว ให้ใช้คุณสมบัติ isEnabled — คุณสามารถสลับได้โดยไม่ต้องลบและลงทะเบียนใหม่

ห่วงโซ่การเรียก

ลำดับการเรียกเป็น ลำดับย้อนกลับของลำดับการเพิ่ม: callback ที่เพิ่มล่าสุดได้รับการควบคุมก่อน ซึ่งสมเหตุสมผลเพราะองค์ประกอบ UI ที่ซ้อนลึกที่สุด (เช่น Bottom Sheet ภายใน Fragment) ควรจัดการการกดก่อน Fragment หลัก หาก callback ที่ลึกที่สุดไม่จัดการการกด (isEnabled = false) การควบคุมจะส่งผ่านไปยังตัวถัดไปในห่วงโซ่

Back Press ใน Fragment และไดอะล็อก

Fragment API ให้การรวมเข้ากับ OnBackPressedDispatcher ของตัวเองผ่านเมธอด requireActivity().onBackPressedDispatcher ตั้งแต่ Fragment 1.2.0 แต่ละ Fragment สามารถลงทะเบียน callback ของตัวเอง ซึ่งผูกกับวงจรชีวิตของ Fragment โดยอัตโนมัติและถูกลบเมื่อถูกทำลาย

Callback ใน Fragment

การลงทะเบียน callback ใน Fragment ทำใน onCreate, onViewCreated หรือแม้แต่ใน View เอง — สิ่งสำคัญคือ LifecycleOwner (Fragment) ต้องทำงานอยู่ เมื่อ Fragment เปลี่ยนเป็นสถานะ STARTED callback จะเปิดใช้งาน เมื่อ STOPPED จะปิดใช้งาน ซึ่งรับประกันว่า Fragment ที่ซ่อนอยู่ (ใน ViewPager) จะไม่จัดการการกดย้อนกลับ

class EditorFragment : Fragment() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val callback = object : OnBackPressedCallback(true) {
            override fun handleOnBackPressed() {
                showDiscardDialog()
            }
        }
        requireActivity().onBackPressedDispatcher.addCallback(this, callback)
    }
}

Dialog และ BottomSheetDialog

ไดอะล็อกและ BottomSheets สกัดกั้นการกดย้อนกลับโดยอัตโนมัติเพื่อปิด หากคุณต้องการดำเนินการเพิ่มเติมก่อนปิด — ให้ลงทะเบียน callback ที่มีลำดับความสำคัญสูงกว่า สำคัญ: หากคุณตั้งค่า setCancelable(false) บน Dialog callback จะไม่ทำงาน — นี่คือพฤติกรรมของระบบ

Back Press Handling ใน Jetpack Compose

Jetpack Compose จัดเตรียม API แบบประกาศสำหรับจัดการปุ่มย้อนกลับผ่านฟังก์ชัน BackHandler composable BackHandler ยอมรับ enabled (สถานะบูลีน) และ onBack — callback ที่เรียกเมื่อกด หาก enabled = false การกดจะถูกส่งต่อลงไปในห่วงโซ่

BackHandler ใน Compose

BackHandler ลงทะเบียน OnBackPressedCallback ใน OnBackPressedDispatcher ของ Activity หลักโดยอัตโนมัติ มันเคารพวงจรชีวิตของ composable: เมื่อออกจากคอมโพซิชัน callback จะถูกลบ enabled สามารถผูกกับสถานะได้ — ตัวอย่างเช่น แสดงไดอะล็อกยืนยันเฉพาะเมื่อฟอร์มมีการเปลี่ยนแปลงที่ยังไม่ได้บันทึก

@Composable
fun EditScreen(hasUnsavedChanges: Boolean) {
    BackHandler(enabled = hasUnsavedChanges) {
        // Show confirmation dialog
    }

    Column {
        TextField(value = ..., onValueChange = ...)
    }
}

Predictive Back ใน Compose

Predictive back gesture ใน Compose รองรับตั้งแต่ Compose 1.5.0 BackHandler จัดการภาพเคลื่อนไหวการเปลี่ยนภาพของระบบโดยอัตโนมัติหากเปิดใช้งานบนอุปกรณ์ สำหรับภาพเคลื่อนไหว predictive ที่กำหนดเอง ให้ใช้ม็อดิฟายเออร์ predictiveBackHandler ซึ่งส่งคืนความคืบหน้าของท่าทางจาก 0 ถึง 1

ข้อผิดพลาดทั่วไปและแนวปฏิบัติที่ดีที่สุด

Back Press Handling ดูเหมือนง่าย แต่ในทางปฏิบัตินักพัฒนาทำข้อผิดพลาดเชิงระบบหลายอย่าง มาดูปัญหาที่พบบ่อยที่สุดและวิธีแก้ไขตามคำแนะนำของ Google และประสบการณ์ของชุมชน

ข้อผิดพลาด: การเรียก finish() โดยไม่ตรวจสอบสแต็กการนำทาง

การเรียก finish() โดยตรง ใน handleOnBackPressed อาจทำให้ออกจากแอปโดยไม่คาดคิดหากมีหน้าจอพื้นหลังในสแต็กการนำทาง ตรวจสอบ NavController.backStack ผ่าน Navigation Component หรือ Coordinator ก่อนปิด Activity เสมอ

ข้อผิดพลาด: การไม่สนใจวงจรชีวิตเมื่อลงทะเบียน callback

หากคุณลงทะเบียน callback โดยไม่มี LifecycleOwner (ใช้ addCallback แบบเก่าที่ไม่มีพารามิเตอร์) callback จะมีชีวิตอยู่ตลอดไปและอาจทำให้เกิด NullPointerException หาก Activity ถูกทำลายแล้ว ให้ใช้ addCallback(this, callback) กับ LifecycleOwner เสมอ

แนวปฏิบัติที่ดีที่สุด: การทำลายห่วงโซ่สำหรับหน้าต่างโมดอล

สำหรับ หน้าต่างโมดอล (Bottom Sheet, Dialog) ให้ตั้งค่า isEnabled = true เฉพาะเมื่อหน้าต่างมองเห็น ใช้ addCallback กับแลมบ์ดาที่ตรวจสอบสถานะหน้าต่าง Navigation Component จัดการนี้โดยอัตโนมัติสำหรับ NavHost

แนวปฏิบัติที่ดีที่สุด: การจัดการการกดสองครั้ง

การกดย้อนกลับสองครั้งอย่างรวดเร็วอาจทำให้เกิด การเรียก finish() ซ้ำ ใช้แฟล็กหรือ throttleLast เพื่อป้องกันการเรียกซ้ำภายใน 500 มิลลิวินาที Navigation Component จัดการสถานการณ์นี้โดยธรรมชาติ แต่ในสถานการณ์ที่กำหนดเอง คุณต้องใช้การป้องกันด้วยตนเอง

private var lastBackPressTime = 0L

override fun handleOnBackPressed() {
    val currentTime = System.currentTimeMillis()
    if (currentTime - lastBackPressTime > 500) {
        lastBackPressTime = currentTime
        navigateBack()
    }
}