Diese Seite wurde von der Cloud Translation API übersetzt.

Inhalte in deiner App randvoll anzeigen

Sobald Sie Ihre App auf SDK 35 oder höher auf einem Gerät mit Android 15 oder höher ausrichten, wird sie randlos angezeigt. Das Fenster erstreckt sich über die gesamte Breite und Höhe des Displays, da es hinter den Systemleisten gezeichnet wird. Zu den Systemleisten gehören die Statusleiste, die Untertitelleiste und die Navigationsleiste.

Viele Apps haben eine obere App-Leiste. Die obere App-Leiste sollte sich bis zum oberen Rand des Displays erstrecken und hinter der Statusleiste angezeigt werden. Optional kann die obere App-Leiste auf die Höhe der Statusleiste angepasst werden, wenn der Inhalt scrollt.

Viele Apps haben auch eine untere App-Leiste oder eine untere Navigationsleiste. Diese Balken sollten sich auch bis zum unteren Bildschirmrand erstrecken und hinter der Navigationsleiste angezeigt werden. Andernfalls sollten Apps scrollbare Inhalte hinter der Navigationsleiste anzeigen.

Abbildung 1. Systemleisten in einem randlosen Layout.

Wenn Sie ein Edge-to-Edge-Layout in Ihrer App implementieren, ist Folgendes zu beachten:

Randloses Display aktivieren
Beheben Sie alle visuellen Überschneidungen.
Sie können auch einen Scrim hinter den Systemleisten anzeigen.

ein Beispiel für Bilder hinter der Statusleiste — **Abbildung 2.** Beispiel für Bilder hinter der Statusleiste.

Randlose Anzeige aktivieren

Wenn Ihre App auf SDK 35 oder höher ausgerichtet ist, wird die randlose Darstellung für Geräte mit Android 15 oder höher automatisch aktiviert.

So aktivieren Sie den Vollbildmodus bei älteren Android-Versionen:

Fügen Sie der Bibliothek androidx.activity in der Datei build.gradle Ihrer App oder Ihres Moduls eine Abhängigkeit hinzu:

Kotlin

dependencies {
    val activity_version = activity_version
    // Java language implementation
    implementation("androidx.activity:activity:$activity_version")
    // Kotlin
    implementation("androidx.activity:activity-ktx:$activity_version")
}

Cool

dependencies {
    def activity_version = activity_version
    // Java language implementation
    implementation 'androidx.activity:activity:$activity_version'
    // Kotlin
    implementation 'androidx.activity:activity-ktx:$activity_version'
}

Importieren Sie die Erweiterungsfunktion enableEdgeToEdge in Ihre App:

Aktivieren Sie Edge-to-Edge manuell. Rufen Sie dazu enableEdgeToEdge in onCreate Ihrer Activity auf. Er sollte vor setContentView aufgerufen werden.

Kotlin

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

Java

     @Override
     protected void onCreate(@Nullable Bundle savedInstanceState) {
       EdgeToEdge.enable(this);
       super.onCreate(savedInstanceState);
       ...
     }

Standardmäßig macht enableEdgeToEdge() die Systemleisten transparent, außer im Bedienungsmodus über 3 Schaltflächen, bei dem die Statusleiste ein durchscheinendes Gitter erhält. Die Farben der Systemsymbole und des Scrims werden je nach hellem oder dunklem Systemdesign angepasst.

Die Funktion enableEdgeToEdge() gibt automatisch an, dass die App randlos angelegt werden soll, und passt die Farben der Systemleisten an.

Wenn Sie die randlose Anzeige in Ihrer App aktivieren möchten, ohne die Funktion enableEdgeToEdge() zu verwenden, lesen Sie den Hilfeartikel Randlose Anzeige manuell einrichten.

Überschneidungen mit Einzügen beheben

Einige Ansichten Ihrer App werden möglicherweise hinter den Systemleisten dargestellt, wie in Abbildung 3 dargestellt.

Sie können Überschneidungen beheben, indem Sie auf Einzüge reagieren, die angeben, welche Teile des Bildschirms sich mit der System-UI überschneiden, z. B. die Navigationsleiste oder die Statusleiste. Bei einer Überschneidung wird die Anzeige über dem Inhalt eingeblendet. Sie kann Ihre App aber auch über Touch-Gesten des Systems informieren.

Für die Vollansicht Ihrer App stehen folgende Arten von Einblendungen zur Verfügung:

Systemleisten-Einzüge:Am besten geeignet für Ansichten, die angetippt werden können und nicht von den Systemleisten verdeckt werden dürfen.
Display-Aussparungen:für Bereiche, in denen aufgrund der Form des Geräts eine Bildschirmaussparung vorhanden sein kann.
System-Gestenbereiche:Bereiche für die Gestennavigation, die vom System verwendet werden und Vorrang vor Ihrer App haben.

Einzüge der Systemleisten

Systemleisten-Einzüge sind die am häufigsten verwendete Art von Einzügen. Sie stellen den Bereich dar, in dem die System-UI in der Z‑Achse über Ihrer App angezeigt wird. Sie eignen sich am besten, um Ansichten in Ihrer App zu verschieben oder zu vergrößern, die anklickbar sind und nicht von den Systemleisten verdeckt werden dürfen.

Zum Beispiel wird die unverankerte Aktionsschaltfläche (UAS) in Abbildung 3 teilweise von der Navigationsleiste verdeckt:

Beispiel für eine Vollbildansicht, bei der die Navigationsleiste das FAB verdeckt — **Abbildung 3.** Navigationsleiste, die sich in einem Vollbild-Layout über eine FAB überschneidet

Um diese Art von visueller Überschneidung im Modus für Touch-Gesten oder im Modus für Schaltflächen zu vermeiden, können Sie die Ränder des Ansichtsbereichs mit WindowInsetsCompat.Type.systemBars() und getInsets(int) vergrößern.

Im folgenden Codebeispiel wird gezeigt, wie Sie Einzüge für die Systemleiste implementieren:

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(fab) { v, windowInsets ->
  val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
  // Apply the insets as a margin to the view. This solution sets
  // only the bottom, left, and right dimensions, but you can apply whichever
  // insets are appropriate to your layout. You can also update the view padding
  // if that's more appropriate.
  v.updateLayoutParams<MarginLayoutParams> {
      leftMargin = insets.left,
      bottomMargin = insets.bottom,
      rightMargin = insets.right,
  }

  // Return CONSUMED if you don't want want the window insets to keep passing
  // down to descendant views.
  WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(fab, (v, windowInsets) -> {
  Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars());
  // Apply the insets as a margin to the view. This solution sets only the
  // bottom, left, and right dimensions, but you can apply whichever insets are
  // appropriate to your layout. You can also update the view padding if that's
  // more appropriate.
  MarginLayoutParams mlp = (MarginLayoutParams) v.getLayoutParams();
  mlp.leftMargin = insets.left;
  mlp.bottomMargin = insets.bottom;
  mlp.rightMargin = insets.right;
  v.setLayoutParams(mlp);

  // Return CONSUMED if you don't want want the window insets to keep passing
  // down to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

Wenn Sie diese Lösung auf das in Abbildung 3 gezeigte Beispiel anwenden, entsteht keine visuelle Überschneidung im Schaltflächenmodus, wie in Abbildung 4 gezeigt:

eine durchsichtige Navigationsleiste, die die Schaltfläche „Bedienungselemente“ nicht bedeckt — **Abbildung 4**: Visuelle Überschneidungen im Schaltflächenmodus beheben.

Das Gleiche gilt für den Modus für die Gestennavigation, wie in Abbildung 5 dargestellt:

randlos mit Bedienung per Geste — **Abbildung 5:** Visuelle Überschneidungen bei der Bedienung über Gesten werden behoben.

Display-Aussparungen

Einige Geräte haben Displayausschnitte. Normalerweise befindet sich die Aussparung oben auf dem Display und ist in der Statusleiste enthalten. Wenn sich das Display des Geräts im Querformat befindet, befindet sich die Aussparung möglicherweise am vertikalen Rand. Je nach Inhalt, der in Ihrer App auf dem Display angezeigt wird, sollten Sie einen Abstand implementieren, um Displayausschnitte zu vermeiden. Standardmäßig werden Apps nämlich in den Displayausschnitt gezeichnet.

Viele App-Bildschirme enthalten beispielsweise eine Liste von Elementen. Listenelemente dürfen nicht durch den Displayausschnitt oder die Systemleisten verdeckt werden.

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerView) { v, insets ->
  val bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
      or WindowInsetsCompat.Type.displayCutout()
  )
  v.updatePadding(
    left = bars.left,
    top = bars.top,
    right = bars.right,
    bottom = bars.bottom,
  )
  WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(mBinding.recyclerView, (v, insets) -> {
  Insets bars = insets.getInsets(
    WindowInsetsCompat.Type.systemBars()
    | WindowInsetsCompat.Type.displayCutout()
  );
  v.setPadding(bars.left, bars.top, bars.right, bars.bottom);
  return WindowInsetsCompat.CONSUMED;
});

Bestimmen Sie den Wert von WindowInsetsCompat, indem Sie die logischen OR-Werte der Systemleisten und der Displayausschnitttypen verwenden.

Legen Sie clipToPadding auf RecyclerView fest, damit das Padding mit den Listenelementen scrollt. Dadurch verbleiben die Elemente hinter den Systemleisten, wenn der Nutzer scrollt, wie im folgenden Beispiel gezeigt.

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />

Einblendungen für System-Gesten

System-Gestenbereiche stellen die Bereiche des Fensters dar, in denen System-Gesten Vorrang vor Ihrer App haben. Diese Bereiche sind in Abbildung 6 orange dargestellt:

Beispiel für Einzüge für Systemgesten — **Abbildung 6:** Einzüge für System-Gesten

Wie bei den Einzügen der Systemleiste können Sie auch die Einzüge für System-Touch-Gesten mit WindowInsetsCompat.Type.systemGestures() über getInsets(int) vermeiden.

Mit diesen Einzügen können Sie wischbare Ansichten von den Rändern weg verschieben oder anpassen. Zu den häufigsten Anwendungsfällen gehören Unterseiten, Wischen in Spielen und Karussells, die mit ViewPager2 implementiert wurden.

Unter Android 10 oder höher enthalten die Einzüge für Systemgesten einen unteren Einzug für die Start-Geste sowie einen linken und rechten Einzug für die Zurück-Gesten:

Beispiel für Messungen von System-Gesten — **Abbildung 7:** Messungen des integrierten Touch-Gestens.

Im folgenden Codebeispiel wird gezeigt, wie Sie Einzüge für Systemgesten implementieren:

Kotlin

ViewCompat.setOnApplyWindowInsetsListener(view) { view, windowInsets ->
    val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures())
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.updatePadding(insets.left, insets.top, insets.right, insets.bottom)

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    WindowInsetsCompat.CONSUMED
}

Java

ViewCompat.setOnApplyWindowInsetsListener(view, (v, windowInsets) -> {
    Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures());
    // Apply the insets as padding to the view. Here, set all the dimensions
    // as appropriate to your layout. You can also update the view's margin if
    // more appropriate.
    view.setPadding(insets.left, insets.top, insets.right, insets.bottom);

    // Return CONSUMED if you don't want the window insets to keep passing down
    // to descendant views.
    return WindowInsetsCompat.CONSUMED;
});

Materialkomponenten

Viele ansichtsbasierte Android Material Components (com.google.android.material){:.external} verarbeiten automatisch Einfügungen, darunter BottomAppBar, BottomNavigationView, NavigationRailView und NavigationView.

AppBarLayout verarbeitet jedoch nicht automatisch Einzüge. Fügen Sie android:fitsSystemWindows="true" hinzu, um Einzüge oben zu verarbeiten.

Weitere Informationen zum Umgang mit Einzügen mit Material Components in Compose

Immersiver Modus

Einige Inhalte werden am besten im Vollbildmodus wiedergegeben, um den Nutzern ein immersiveres Erlebnis zu bieten. Sie können die Systemleisten im immersiven Modus mithilfe der Bibliotheken WindowInsetsController und WindowInsetsControllerCompat ausblenden:

Kotlin

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

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

// Show the system bars.
windowInsetsController.show(Type.systemBars())

Java

Window window = getWindow();
WindowInsetsControllerCompat windowInsetsController =
      WindowCompat.getInsetsController(window, window.getDecorView());
if (windowInsetsController == null) {
    return;
  }
// Hide the system bars.
windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());

// Show the system bars.
windowInsetsController.show(WindowInsetsCompat.Type.systemBars());

Weitere Informationen zur Implementierung dieser Funktion finden Sie unter Systemleisten im immersiven Modus ausblenden.

Schutz der Systemleiste

Sobald Ihre App auf SDK 35 oder höher ausgerichtet ist, wird Edge-to-Edge erzwungen. Die Systemstatusleiste und die Navigationsleisten für Gesten sind transparent, die Navigationsleiste mit drei Schaltflächen ist jedoch durchscheinend.

Wenn Sie den standardmäßigen halbtransparenten Hintergrundschutz für die Navigation mit drei Schaltflächen entfernen möchten, setzen Sie Window.setNavigationBarContrastEnforced auf false.

Weitere Informationen

Weitere Informationen zu WindowInsets, Gestennavigation und Einblendungen finden Sie in den folgenden Referenzen: