Używanie wstawek Material 3

Wiele wbudowanych komponentów Material 3 (androidx.compose.material3) samodzielnie obsługuje wcięcia, w zależności od tego, jak są umieszczone w aplikacji zgodnie ze specyfikacjami Material.

Funkcje kompozycyjne do obsługi wcięć

Poniżej znajdziesz listę komponentów Material, które automatycznie obsługują wcięcia.

Paski aplikacji

• TopAppBar / SmallTopAppBar / CenterAlignedTopAppBar / MediumTopAppBar / LargeTopAppBar: stosuje górną i poziomą krawędź pasków systemowych jako dopełnienie, ponieważ jest używany u góry okna.
• BottomAppBar: dodaje dopełnienie po dolnej i poziomej stronie pasków systemowych.

Kontenery treści

• ModalDrawerSheet / DismissibleDrawerSheet / PermanentDrawerSheet (treści w modalnym panelu nawigacji): stosuje do treści wcięcia pionowe i początkowe.
• ModalBottomSheet: stosuje wstawki dolne.
• NavigationBar : stosuje wcięcia bottom i horizontal.
• NavigationRail: stosuje wcięcia pionowe i początkowe.

Scaffold

Domyślnie Scaffold udostępnia wcięcia jako parametr PaddingValues, który możesz wykorzystać. Scaffold nie stosuje marginesów do treści. Odpowiadasz za to Ty. Aby na przykład użyć tych wstawek w LazyColumn w Scaffold:

Scaffold { innerPadding ->
    // innerPadding contains inset information for you to use and apply
    LazyColumn(
        // consume insets as scaffold doesn't do it by default
        modifier = Modifier.consumeWindowInsets(innerPadding),
        contentPadding = innerPadding
    ) {
        // ..
    }
}
InsetsSnippets.kt

Ten film pokazuje LazyColumn w Scaffold z wyłączonym i włączonym wyświetlaniem od krawędzi do krawędzi:

Użycie parametru PaddingValues w Scaffold zwykle wystarcza, aby odsunąć interfejs od interfejsu systemu i wycięć na wyświetlaczu. Jeśli używasz Scaffold, unikaj stosowania dodatkowych metod obsługi wstawień, takich jak linijki, modyfikatory dopełnienia lub modyfikatory rozmiaru wstawienia, aby nie stosować zbyt dużego dopełnienia w interfejsie.

Zastępowanie domyślnych marginesów

Możesz zmienić parametr windowInsets przekazywany do funkcji kompozycyjnej, aby skonfigurować jej działanie. Ten parametr może być innym typem wstawki okna, który ma zostać zastosowany, lub może być wyłączony przez przekazanie pustej instancji:WindowInsets(0, 0, 0, 0).

Jeśli np. chcesz wyłączyć obsługę wstawki w przypadku elementu LargeTopAppBar, ustaw parametr windowInsets na pustą instancję:

LargeTopAppBar(
    windowInsets = WindowInsets(0, 0, 0, 0),
    title = {
        Text("Hi")
    }
)
InsetsSnippets.kt