Diese Seite wurde von der Cloud Translation API übersetzt.

Inhalte in deiner App randvoll anzeigen

Wenn 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 App-Leiste oben. 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 schrumpfen, 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.

Beachten Sie bei der Implementierung eines Vollbildlayouts in Ihrer App Folgendes:

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")
}

Groovy

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:

Sie können die randlose Anzeige manuell aktivieren, indem Sie enableEdgeToEdge in onCreate Ihres Activity aufrufen. 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 werden die Systemleisten von enableEdgeToEdge() transparent dargestellt, mit Ausnahme des Navigationsmodus mit drei Schaltflächen, bei dem die Statusleiste einen halbtransparenten Schleier 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.

Informationen zum Aktivieren des randlosen Displays in Ihrer App ohne die Funktion enableEdgeToEdge() finden Sie unter Randloses Display 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. „Überschneiden“ kann bedeuten, dass die Anzeige über den Inhalten eingeblendet wird, aber auch, dass Ihre App über Systemgesten informiert wird.

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.
Bereiche mit Displayaussparungen:für Bereiche, in denen aufgrund der Form des Geräts eine Displayaussparung vorhanden sein kann.
System-Gestenbereiche:Bereiche für die Gestennavigation, die vom System verwendet werden und Vorrang vor Ihrer App haben.

Einzüge von 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.

In Abbildung 3 wird beispielsweise der Floating-Action-Button (FAB) 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 Beispiel in Abbildung 3 anwenden, gibt es im Schaltflächenmodus keine visuelle Überschneidung, wie in Abbildung 4 dargestellt:

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

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 im Modus „Bedienung über Gesten“ wurden behoben.

Einzüge für Displayaussparungen

Einige Geräte haben Ausschnitte im Display. 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 logische ODER-Bedingung der Systemleisten und der Displayausschnitttypen anwenden.

Legen Sie clipToPadding auf RecyclerView fest, damit das Padding mit den Listenelementen scrollt. So können die Elemente beim Scrollen des Nutzers hinter den Systemleisten verschwinden, 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" />

Einzüge 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:

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

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 und einen linken und rechten Einzug für die Zurück-Gesten:

Beispiel für Messungen von System-Gesten — **Abbildung 7:** Maße für den Einzug von System-Gesten

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 ansichtenbasierte Android-Materialkomponenten (com.google.android.material){:.external} verarbeiten Einzüge automatisch, 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 für den immersiven Modus mit den 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 für den Vollbildmodus 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: