หลักการนำทาง

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

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

ปลายทางเริ่มต้นแบบคงที่

ทุกแอปที่คุณสร้างมีจุดหมายเริ่มต้นที่แน่นอน นี่เป็นหน้าจอแรก ที่ผู้ใช้จะเห็นเมื่อเปิดแอปของคุณจาก Launcher ปลายทางนี้ยังเป็นหน้าจอสุดท้ายที่ผู้ใช้เห็นเมื่อกลับไปที่ตัวเปิดแอปหลังจากกดปุ่มย้อนกลับ เรามาดูกันที่ แอป Sunflower

รูปที่ 1 หน้าจอรายการคือปลายทางเริ่มต้นของแอป Sunflower

เมื่อเปิดแอป Sunflower จากตัวเปิดแอป หน้าจอแรกที่ผู้ใช้จะเห็นคือหน้าจอรายการ ซึ่งเป็นรายการพืชในสวน ซึ่งจะเป็นหน้าจอสุดท้ายที่ผู้ใช้เห็นก่อนที่จะออกจากแอป หากผู้ใช้กดปุ่มย้อนกลับจากหน้าจอรายการ ระบบจะนํากลับไปที่ตัวเปิดแอป

หมายเหตุ: แอปอาจมีการตั้งค่าแบบครั้งเดียวหรือหลายครั้ง หน้าจอการเข้าสู่ระบบ หน้าจอแบบมีเงื่อนไขเหล่านี้ไม่ควรถือเป็นปลายทางเริ่มต้น เนื่องจากผู้ใช้จะเห็นหน้าจอเหล่านี้ในบางกรณีเท่านั้น

สถานะการนำทางแสดงเป็นกลุ่มจุดหมาย

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

การดำเนินการที่เปลี่ยนกองซ้อนด้านหลังจะดำเนินการที่ด้านบนของกองซ้อนเสมอ ไม่ว่าจะโดยการดันปลายทางใหม่ไปยังด้านบนของกองซ้อน หรือโดยการดึงปลายทางบนสุดออกจากกองซ้อน การนำทางไปยังจุดหมายจะเป็นผลักให้ ปลายทางที่ด้านบนของกลุ่ม

คอมโพเนนต์การนำทางจะจัดการ การจัดเรียงรายการหลังทั้งหมดให้คุณ แต่ก็เลือกจัดการ กองหลังด้วยตัวเอง

ขึ้นและกลับเหมือนกันภายในงานของแอป

รูปที่ 2 ปุ่มขึ้นและย้อนกลับ

ปุ่มย้อนกลับจะปรากฏในแถบนำทางของระบบที่ด้านล่างของหน้าจอ และใช้เพื่อไปยังส่วนต่างๆ ตามลำดับเวลาย้อนกลับผ่านประวัติของหน้าจอที่ผู้ใช้เพิ่งทำงานด้วย เมื่อคุณกดปุ่ม "ย้อนกลับ" ปลายทางปัจจุบันถูกดึงมาจากด้านบนของกลุ่ม ด้านหลัง จากนั้น นำทางไปยังปลายทางก่อนหน้า

ปุ่มขึ้นจะปรากฏในแถบแอปที่ด้านบนสุดของ บนหน้าจอ ภายในงานของแอป ปุ่มขึ้นและกลับจะทำงานเหมือนกัน

ปุ่มขึ้นจะไม่ออกจากแอป

หากผู้ใช้อยู่ที่ปลายทางเริ่มต้นของแอป ปุ่มขึ้นจะไม่ปรากฏ เพราะปุ่มขึ้นจะไม่ออกไปจากแอป แต่ปุ่มย้อนกลับจะแสดง และออกจากแอป

เมื่อเปิดแอปโดยใช้ Deep Link ในภารกิจของแอปอื่น Up จะเปลี่ยนเส้นทางผู้ใช้กลับไปยังภารกิจของแอปคุณและผ่านกองซ้อนที่จำลองการย้อนกลับ ไม่ใช่ไปยังแอปที่ทริกเกอร์ Deep Link แต่ปุ่มย้อนกลับจะนําคุณกลับไปที่แอปอื่น

การทำ Deep Link จะจำลองการนำทางด้วยตนเอง

ไม่ว่าจะใช้การทำ Deep Link หรือไปยังปลายทางที่เฉพาะเจาะจงด้วยตนเอง คุณสามารถใช้ปุ่มขึ้นเพื่อไปยังปลายทางต่างๆ และกลับไปที่ปลายทางเริ่มต้นได้

เมื่อทํา Deep Link ไปยังปลายทางภายในงานของแอป ระบบจะนำสแต็กย้อนกลับที่มีอยู่สําหรับงานของแอปออกและแทนที่ด้วยสแต็กย้อนกลับที่ทำ Deep Link

ในตัวอย่างของแอป Sunflower ให้สมมติว่าผู้ใช้ ก่อนหน้านี้ได้เปิดแอปจากหน้าจอ Launcher และไปยังรายละเอียด หน้าจอ Apple การดูหน้าจอล่าสุดจะระบุว่ามีงานอยู่ โดยหน้าจอด้านบนสุดคือหน้าจอรายละเอียดของ Apple

รูปที่ 3 การนำทางของผู้ใช้ผ่านแอป Sunflower และกองซ้อนที่แสดงผล

ณ จุดนี้ ผู้ใช้สามารถแตะปุ่มหน้าแรกเพื่อใส่แอปลงใน พื้นหลัง ต่อไป สมมติว่าแอปนี้มีฟีเจอร์ Deep Link ที่ช่วยให้ผู้ใช้ เพื่อเปิดเข้าสู่หน้าจอรายละเอียดพืชที่เจาะจงตามชื่อ กำลังเปิดแอป ผ่านทาง Deep Link นี้ จะแทนที่ Sunflower สแต็กปัจจุบันที่แสดงใน รูปที่ 3 พร้อมด้วยแบ็กสแต็กใหม่ ดังแสดงในรูปที่ 4:

รูปที่ 4 การติดตาม Deep Link จะแทนที่กองซ้อนย้อนกลับที่มีอยู่สําหรับแอป Sunflower

โปรดสังเกตว่ากองซ้อนพื้นหลังของ Sunflower ถูกแทนที่โดย กลุ่มกลับสังเคราะห์ โดยมีหน้าจอรายละเอียดอะโวคาโดที่ด้านบน หน้าจอสวนของฉัน เพิ่มปลายทางเริ่มต้นไว้ในสแต็กด้านหลังแล้ว ต้นตำรับดอกทานตะวัน สแต็กจะหายไป ซึ่งรวมถึงการที่แอปทราบว่าผู้ใช้อยู่ใน Apple ก่อน ทั้งหมดนี้มีความสำคัญเนื่องจากสแต็กด้านหลังสังเคราะห์ ต้องเป็นความจริง โดยควรตรงกับกองซ้อนที่ย้อนกลับซึ่งอาจเกิดขึ้นจากการไปยังส่วนต่างๆ ของแอปอย่างเป็นธรรมชาติ

เพื่อให้เป็นไปตามความต้องการนี้ สแต็กด้านหลังสังเคราะห์ที่สร้างขึ้นจะเป็นสแต็กที่เรียบง่ายขึ้น อ้างอิงจาก NavGraph สำหรับ NavGraph ธรรมดาที่ไม่ได้ฝังไว้ NavGraph นี้จะประกอบด้วยปลายทางเริ่มต้นและปลายทางของ Deep Link สำหรับข้อมูลเพิ่มเติม กราฟการนำทางแบบซ้อนที่ซับซ้อน สแต็กแบ็กสังเคราะห์จะมีปลายทางเริ่มต้นของทุกสแต็ก กราฟที่เป็นระดับบนของปลายทาง Deep Link

คอมโพเนนต์การนําทางรองรับการฝังลิงก์และสร้างกองซ้อนที่ย้อนกลับได้สมจริงให้คุณเมื่อลิงก์ไปยังปลายทางใดก็ได้ในกราฟการนําทาง