Używanie wstawek Material 3

Wiele wbudowanych komponentów Material 3androidx.compose.material3 samodzielnie obsługuje wcięcia na podstawie 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: stosuje jako dopełnienie dolną i poziomą stronę pasków systemowych.

Kontenery treści

• ModalDrawerSheet / DismissibleDrawerSheet / PermanentDrawerSheet (treść w wysuwanym menu nawigacyjnym): 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 wcięć do treści; jest to Twoja odpowiedzialność. Aby na przykład użyć tych wstawek w elemencie LazyColumn w elemencie 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 wcięć, takich jak linijki, modyfikatory dopełnienia lub modyfikatory rozmiaru wcięć, 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