Ausschnitte in Compose

Bei einigen Geräten ist eine Display-Aussparung ein Bereich, der in das Display hineinreicht. Oberfläche. Sie ermöglicht ein Edge-to-Edge-Erlebnis und bietet gleichzeitig Platz für wichtige Sensoren an der Vorderseite des Geräts.

<ph type="x-smartling-placeholder">

</ph>

<ph type="x-smartling-placeholder">

</ph>

Android unterstützt Display-Aussparungen auf Geräten mit Android 9 (API-Level 28) und höher liegen. Gerätehersteller können Display-Aussparungen auch auf mit Android 8.1 oder niedriger.

Auf dieser Seite wird beschrieben, wie die Unterstützung für Geräte mit Aussparungen in Beim Schreiben von Texten sollte auch der Aussparungsbereich (von Rand zu Rand) verwendet werden. Rechteck auf der Displayoberfläche, das die Aussparung enthält.

Standardfall

Standardmäßig sind Display-Aussparungen in den Informationen für Fenstereinblendungen enthalten. Deshalb zeichnet deine App nicht in den Display-Aussparungen, wenn du dem wie Sie Ihre App randlos gestalten.

Wenn Sie beispielsweise Modifier.windowInsetsPadding(WindowInsets.safeContent) oder Modifier.windowInsetsPadding(WindowInsets.safeDrawing), deine App automatisch nicht in den Bereichen gezeichnet, in denen sich eine Aussparung befindet. WindowInsets.safeContent und WindowInsets.safeDrawing Sie enthalten Informationen zur Display-Aussparung und werden nicht an der Stelle gezeichnet, an der sich eine Geräteaussparung befindet. ist.

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

    WindowCompat.setDecorFitsSystemWindows(window, false)

    setContent {
        Box(Modifier.windowInsetsPadding(WindowInsets.safeContent)) {
            // Any composable inside here will avoid drawing behind cutouts
        }
    }
}
CutoutSnippets.kt

Wenn Sie dieses Verhalten weiter anpassen möchten, müssen Sie die Informationen zur Aussparung verarbeiten, selbst.

Informationen zu Ausschnitten manuell verarbeiten

Sie haben folgende Möglichkeiten, Bildausschnitte zu bearbeiten:

• WindowInsets.displayCutout wird verwendet

• Einstellung im Designmanifest mit android:windowLayoutInDisplayCutoutMode

• Programmatisch die Option für ein Window mit window.attributes.layoutInDisplayCutoutMode festlegen

• Mit LocalView.current.rootWindowInsets.displayCutout auf das Path-Objekt „Aussparung“ zugreifen

Für die Funktion „Schreiben“ sollten Sie für windowLayoutInDisplayCutoutMode Folgendes festlegen: default in Ihrem Gesamtthema und nutzen Sie dann WindowInsets.displayCutout wie Sie die Insets in Ihren zusammensetzbaren Funktionen verarbeiten:

Canvas(modifier = Modifier.fillMaxSize().windowInsetsPadding(WindowInsets.displayCutout)) {
    drawRect(Color.Red, style = Stroke(2.dp.toPx()))
}
CutoutSnippets.kt

Bei diesem Ansatz können Sie das Padding für displayCutout im Bedarfsfall berücksichtigen, oder ignorieren, wo es nicht erforderlich ist.

Alternativ können Sie dieselben Einstellungen anwenden wie beim Aussparungstyp „Ansichten“ in der Dokumentation beschrieben, indem Sie entweder das Aktivitätsthema android:windowLayoutInDisplayCutoutMode in ein anderes oder legen Sie das Fensterattribut mithilfe window.attributes.layoutInDisplayCutoutMode = LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT. Dann wird jedoch der Ausschneidemodus angewendet, und kann nicht für jede zusammensetzbare Funktion gesteuert werden.

Um die Display-Aussparung in bestimmten zusammensetzbaren Funktionen zu berücksichtigen, verwenden Sie WindowInset.displayCutout Mit dieser API können Sie auf die Aussparung Informationen erhalten, wenn erforderlich.

Best Practices

Beachten Sie bei der Arbeit mit Display-Aussparungen Folgendes:

• Achten Sie auf die Platzierung kritischer Elemente auf der Benutzeroberfläche. Lassen Sie die wichtige Textelemente, Steuerelemente oder andere Informationen verdecken.
• Platzieren oder erweitern Sie keine interaktiven Elemente, die eine feine Berührung erfordern. in den Aussparungsbereich einfügen. Die Berührungsempfindlichkeit ist möglicherweise im ausgeschnitten.
• Wenn Sie sich an die randlosen Richtlinien halten, werden Informationen zu den Ausschnitten in den die Einsätze safeDrawing / safeContent.
• Verwende nach Möglichkeit Modifier.windowInsetsPadding(WindowInsets.safeDrawing) um den passenden Abstand für Ihren Content zu bestimmen. Vermeiden Die Höhe der Statusleiste hartcodieren, da dies zu einer Überschneidung oder einem Abbruch führen kann Inhalte.

Darstellung von Inhalten mit Aussparungen testen

Testen Sie alle Bildschirme und Nutzerfreundlichkeit Ihrer App. Test auf Geräten mit verschiedene Arten von Aussparungen. Wenn du kein Gerät mit einer Cutout kannst du gängige Aussparungskonfigurationen auf jedem Gerät oder Emulator simulieren mit Android 9 oder höher. Gehen Sie dazu so vor:

1. Aktivieren Sie Entwickleroptionen.
2. Scrollen Sie auf dem Bildschirm Entwickleroptionen nach unten zum Abschnitt Zeichnung. und wählen Sie Display mit Aussparung simulieren aus.
3. Wählen Sie die Art der Aussparung aus. <ph type="x-smartling-placeholder">

   </ph>

Empfehlungen für dich

• Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
• Fenstereinblendungen in „Compose“
• Grafikmodifikatoren
• Absatz gestalten