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 jako dopełnienie górną i poziomą krawędź pasków systemowych, 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 wcięcia u dołu.
• 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 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:

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