ตั้งค่าการแสดงผลแบบไร้ขอบด้วยตนเอง

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

จัดวางแอปแบบเต็มหน้าจอ

ใช้ WindowCompat.setDecorFitsSystemWindows(window, false) เพื่อจัดวางแอปของคุณไว้หลังแถบระบบ ดังที่แสดงในโค้ดต่อไปนี้ ตัวอย่าง:

override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  WindowCompat.setDecorFitsSystemWindows(window, false)
}

@Override
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  WindowCompat.setDecorFitsSystemWindows(getWindow(), false);
}

เปลี่ยนสีของแถบระบบ

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

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

• โหมดปุ่ม: ระบบจะเลือกใช้โปร่งแสง Scrim อยู่หลังแถบระบบ (สำหรับ API ระดับ 29 ขึ้นไป) หรือระบบที่โปร่งใส (สำหรับ API ระดับ 28 หรือก่อนหน้า)

• สีเนื้อหาของแถบสถานะ: ควบคุมสีของเนื้อหาในแถบสถานะ เช่น ซึ่งก็คือเวลาและไอคอน

คุณสามารถแก้ไขไฟล์ themes.xml เพื่อกำหนดสีของแถบนำทางและ (ไม่บังคับ) เพื่อตั้งค่าแถบสถานะเป็นโปร่งใสและสีเนื้อหาของแถบสถานะ มืด

<!-- values-v29/themes.xml -->
<style name="Theme.MyApp">
  <item name="android:navigationBarColor">
     @android:color/transparent
  </item>

  <!-- Optional: set to transparent if your app is drawing behind the status bar. -->
  <item name="android:statusBarColor">
     @android:color/transparent
  </item>

  <!-- Optional: set for a light status bar with dark content. -->
  <item name="android:windowLightStatusBar">
    true
  </item>
</style>

คุณสามารถใช้ WindowInsetsController API โดยตรง แต่เราขอแนะนำอย่างยิ่งให้ใช้ไลบรารีการสนับสนุน WindowInsetsControllerCompat หากเป็นไปได้ คุณสามารถใช้ WindowInsetsControllerCompat API แทน theme.xml เพื่อควบคุมสีเนื้อหาของแถบสถานะ โดยใช้ setAppearanceLightNavigationBars() ฟังก์ชัน โดยส่งผ่านใน true เพื่อเปลี่ยนสีพื้นหน้าของการนำทางเป็น สีอ่อนหรือ false เพื่อเปลี่ยนกลับเป็นสีเริ่มต้น

val windowInsetsController =
      ViewCompat.getWindowInsetsController(window.decorView)

windowInsetsController?.isAppearanceLightNavigationBars = true

WindowInsetsControllerCompat windowInsetsController =
      ViewCompat.getWindowInsetsController(getWindow().getDecorView());
if (windowInsetsController == null) {
    return;
}

windowInsetsController.setAppearanceLightNavigationBars(true);