Konfigurowanie wyświetlania bez ramki

Wyświetlanie bez ramki umożliwia aplikacji rysowanie interfejsu użytkownika za paskami systemu – paskiem stanu, paskiem tytułu i paskiem nawigacji – aby zapewnić użytkownikom lepsze wrażenia. Jeśli kierujesz aplikację na urządzenia z Androidem 15 (API na poziomie 35) lub nowszym, wyświetlanie bez ramki jest wymuszane domyślnie.

Aby prawidłowo wyświetlać treści bez ramki we wszystkich wersjach Androida, wykonaj te czynności konfiguracyjne. Bez tych czynności aplikacja może rysować jednolite kolory za paskami systemu lub nie animować treści synchronicznie z przejściami klawiatury ekranowej (IME).

1. Włącz wyświetlanie bez ramki

Aby włączyć wyświetlanie bez ramki w poprzednich wersjach Androida, wywołaj enableEdgeToEdge() w metodzie Activity.onCreate():

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()
    ...
}

Domyślnie enableEdgeToEdge() sprawia, że paski systemu są przezroczyste, z wyjątkiem trybu nawigacji przy użyciu 3 przycisków, w którym stosuje półprzezroczystą zasłonę na pasku nawigacji, aby uzyskać lepszy kontrast. Kolor ikon systemu i zasłony dostosowuje się do jasnego lub ciemnego motywu systemu.

2. Skonfiguruj windowSoftInputMode

Ustaw android:windowSoftInputMode="adjustResize" w wpisie AndroidManifest.xml aktywności. To ustawienie umożliwia aplikacji otrzymywanie odcięć IME, co pozwala dostosować układ za pomocą dopełnienia, gdy klawiatura ekranowa pojawia się lub znika.

<!-- In your AndroidManifest.xml file: -->
<activity
  android:name=".ui.MainActivity"
  android:label="@string/app_name"
  android:windowSoftInputMode="adjustResize"
  android:theme="@style/Theme.MyApplication"
  android:exported="true">
  ...
</activity>

3. Obsługuj nakładanie się elementów za pomocą odcięć

Gdy wyświetlanie bez ramki jest włączone, niektóre treści i elementy interfejsu aplikacji mogą być rysowane za paskami systemu. Aby zapobiec zasłanianiu ważnych lub interaktywnych elementów przez paski systemu lub nakładaniu się na gesty systemu, musisz obsługiwać odcięcia.

Odcięcia opisują części ekranu, które przecinają się z interfejsem systemu lub gestami systemu. Główne typy odcięć, które należy wziąć pod uwagę w przypadku wyświetlania bez ramki:

• Odcięcia pasków systemu: reprezentują obszary, w których wyświetlane są paski systemu. Używaj ich, aby uniknąć zasłaniania interfejsu przez paski systemu.
• Odcięcia wycięcia w ekranie: reprezentują obszary, w których na ekranie urządzenia znajduje się fizyczne wycięcie (np. wycięcie na aparat).

W Compose możesz obsługiwać odcięcia za pomocą linijek, modyfikatorów dopełnienia lub modyfikatorów rozmiaru odcięcia. Szczegółowe wskazówki znajdziesz w artykule Odcięcia okna.

Tematy zaawansowane

W przypadku bardziej zaawansowanych przypadków użycia wyświetlania bez ramki rozważ te kwestie.

Tryb pojemny

Niektóre treści, takie jak filmy czy mapy, lepiej wyglądają w trybie pojemnym, w którym paski systemu są ukryte. Możesz ukryć paski systemu za pomocą WindowInsetsControllerCompat:

val windowInsetsController =
    WindowCompat.getInsetsController(window, window.decorView)

// Hide the system bars.
windowInsetsController.hide(WindowInsetsCompat.Type.systemBars())

// Show the system bars.
windowInsetsController.show(WindowInsetsCompat.Type.systemBars()) For example, use either `Scaffold`,

Kolory i ikony pasków systemu

Gdy korzystasz z wyświetlania bez ramki, tło aplikacji może być widoczne za paskami systemu, dlatego może być konieczne dostosowanie kolorów ikon pasków systemu, aby uzyskać lepszy kontrast.

Aby zmienić ikony paska stanu na jasne lub ciemne, użyj WindowInsetsControllerCompat:

// Set status bar icons to dark
WindowCompat.getInsetsController(window, window.decorView)
    .isAppearanceLightStatusBars = true

// Set status bar icons to light
WindowCompat.getInsetsController(window, window.decorView)
    .isAppearanceLightStatusBars = false

Ochrona pasków systemu

Chociaż enableEdgeToEdge() zapewnia domyślne przezroczyste lub półprzezroczyste paski systemu, może być konieczne dostosowanie tego ustawienia. Zapoznaj się z wytycznymi dotyczącymi projektowania pasków systemu Androida i wytycznymi dotyczącymi projektowania bez ramki, aby zdecydować, kiedy używać pasków przezroczystych, a kiedy półprzezroczystych.

Aby pasek nawigacji przy użyciu 3 przycisków był całkowicie przezroczysty zamiast półprzezroczystego, możesz wyłączyć wymuszanie kontrastu:

window.isNavigationBarContrastEnforced = false

Więcej informacji znajdziesz w artykule Ochrona pasków systemu.

Okna

Aby wyświetlać okna pełnoekranowe bez ramki, wywołaj WindowCompat.enableEdgeToEdge w metodzie onStart() okna:

class MyAlertDialogFragment : DialogFragment() {
    override fun onStart(){
        super.onStart()
        dialog?.window?.let { WindowCompat.enableEdgeToEdge(it) }
    }
    ...
}