หน้านี้ได้รับการแปลโดย Cloud Translation API

แถบระบบ Android

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

คุณควรคำนึงถึงความโดดเด่นของแถบระบบ ไม่ว่าจะเป็นการออกแบบ UI สำหรับการโต้ตอบกับระบบปฏิบัติการ Android, วิธีการป้อนข้อมูล หรือความสามารถอื่นๆ ของอุปกรณ์

สรุปประเด็นสำคัญ

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

แถบสถานะ

ใน Android แถบสถานะจะมีไอคอนการแจ้งเตือนและไอคอนระบบ ผู้ใช้โต้ตอบกับแถบสถานะโดยการดึงลงเพื่อเข้าถึงหน้าต่างแจ้งเตือน แถบสถานะมีสไตล์ได้ทั้งแบบโปร่งใสหรือทึบแสง

ไอคอนในแถบสถานะ

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

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

รูปที่ 4 ไอคอนการแจ้งเตือนในแถบสถานะ

ตั้งค่ารูปแบบแถบสถานะ

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

Android 15 บังคับใช้การแสดงผลแบบไร้ขอบ ซึ่งทำให้แถบสถานะโปร่งใสโดยค่าเริ่มต้น เรียกใช้ enableEdgeToEdge() เพื่อให้มีความเข้ากันได้แบบย้อนหลัง

ในรูปภาพด้านซ้าย แถบสถานะจะโปร่งใสและพื้นหลังสีเขียวของ TopAppBar จะวาดอยู่หลังแถบสถานะ

**รูปที่ 5** อย่าลืมใช้พื้นที่เต็มหน้าจอเพื่อเพิ่มประสิทธิภาพให้กับเนื้อหา ไม่มีแถบระบบทึบ

แถบสถานะแบบโปร่งใสเหมาะสําหรับกรณีที่ UI ไม่ปรากฏใต้แถบสถานะหรือมีภาพวาดอยู่ใต้แถบสถานะ แถบสถานะแบบโปร่งแสงเหมาะสําหรับกรณีที่ UI เลื่อนอยู่ใต้แถบสถานะ ดูข้อมูลเพิ่มเติมเกี่ยวกับการป้องกันแบบไล่ระดับสีได้ที่การออกแบบแบบเต็มหน้าจอ

**รูปที่ 6** แอปแบบเต็มหน้าจอที่มีการปกป้องแบบไล่ระดับสี 2 โทนซึ่งครอบคลุม 2 แผงหลังแถบสถานะของระบบ

Android ช่วยให้ผู้ใช้ควบคุมการไปยังส่วนต่างๆ โดยใช้การควบคุม "ย้อนกลับ" "หน้าแรก" และ "ภาพรวม" ดังนี้

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

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

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

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

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

ดูข้อมูลเพิ่มเติมได้ที่เพิ่มการรองรับการไปยังส่วนต่างๆ ด้วยท่าทางสัมผัส

**รูปที่ 7** แถบนำทางของแฮนเดิลการไปยังส่วนต่างๆ

การนำทางแบบ 3 ปุ่มจะมีปุ่มกลับ ปุ่มหน้าแรก และปุ่มภาพรวม

ผู้ใช้อาจเห็นการกำหนดค่าแถบนําทางอื่นๆ ขึ้นอยู่กับเวอร์ชัน Android และอุปกรณ์ เช่น การนำทางแบบ 2 ปุ่มจะมีปุ่มหน้าแรกและปุ่มกลับ

ไอคอนแถบนำทาง

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

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

โหมดการไปยังส่วนต่างๆ ด้วยท่าทางสัมผัส

หลังจากกำหนดเป้าหมายเป็น Android 15 หรือเรียกใช้ enableEdgeToEdge ใน Activity แล้ว ระบบจะวาดแถบนำทางด้วยท่าทางสัมผัสแบบโปร่งใสและใช้การปรับสีแบบไดนามิก ในตัวอย่างที่ตามมา แฮนเดิลในแถบนําทางจะเปลี่ยนเป็นสีเข้มหากวางไว้เหนือเนื้อหาสีอ่อน และในทางกลับกัน

เราขอแนะนำให้ใช้แถบนําทางด้วยท่าทางสัมผัสแบบโปร่งใสเสมอ

ควรทำ

ทำให้แถบนำทางด้วยท่าทางสัมผัสโปร่งใสอยู่เสมอ

ไม่ควรทำ

เพิ่มพื้นหลังในแถบนำทางด้วยท่าทางสัมผัส

โหมดปุ่ม

หลังจากกำหนดเป้าหมายเป็น Android 15 หรือเรียกใช้ enableEdgeToEdge ใน Activity แล้ว ระบบจะใช้หน้าจอโปร่งแสงด้านหลังแถบการนำทางแบบปุ่ม ซึ่งคุณนำออกได้โดยการตั้งค่า Window.setNavigationBarContrastEnforced() เป็นเท็จ

**รูปที่ 11** การปรับสีแบบไดนามิกด้วยม่านโปร่งแสง

เราขอแนะนําให้ใช้แถบนําทางแบบ 3 ปุ่มที่โปร่งใสเมื่อมีแถบแอปด้านล่างหรือแถบนําทางแอปด้านล่าง หรือเมื่อ UI ไม่เลื่อนอยู่ใต้แถบนําทางแบบ 3 ปุ่ม หากต้องการแถบนําทางแบบโปร่งใส ให้ตั้งค่า Window.setNavigationBarContrastEnforced() เป็น "เท็จ" และเพิ่มระยะห่างแถบแอปด้านล่างเพื่อวาดใต้แถบนําทางของระบบ ดังที่แสดงในรูปที่ 7, 8 และ 9 ดูข้อมูลเพิ่มเติมได้ที่การป้องกันแถบระบบ

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

แป้นพิมพ์และการนำทาง

**รูปที่ 12** แป้นพิมพ์บนหน้าจอที่มีแถบนําทาง

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

หน้าจอรอยบาก

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

โหมดใหญ่พิเศษ

**รูปที่ 14** โหมดสมจริงที่แสดงประสบการณ์การใช้งานแบบเต็มหน้าจอบนอุปกรณ์เคลื่อนที่ที่วางแนวนอน

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