Sử dụng phần lồng ghép Material 3

Để dễ sử dụng, nhiều thành phần kết hợp Material 3 tích hợp sẵn (androidx.compose.material3) sẽ tự xử lý phần lồng ghép, dựa trên cách các thành phần kết hợp được đặt trong ứng dụng theo quy cách của Material.

Các thành phần kết hợp xử lý phần lồng ghép

Sau đây là danh sách Các thành phần Material tự động xử lý phần lồng ghép.

Thanh ứng dụng

Vùng chứa nội dung

Scaffold

Theo mặc định, Scaffold cung cấp phần lồng ghép dưới dạng tham số paddingValues để bạn sử dụng. Scaffold không áp dụng phần lồng ghép cho nội dung; bạn phải chịu trách nhiệm về việc này. Ví dụ: để sử dụng các phần lồng ghép này bằng LazyColumn bên trong 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

Video sau đây cho thấy một LazyColumn trong một Scaffold có màn hình tràn viền ở trạng thái tắt và bật:

Ghi đè phần lồng ghép mặc định

Bạn có thể thay đổi tham số windowInsets được truyền đến thành phần kết hợp để định cấu hình hành vi của thành phần kết hợp. Tham số này có thể là một loại phần lồng ghép cửa sổ khác để áp dụng thay thế hoặc bị vô hiệu hoá bằng cách truyền một thực thể trống: WindowInsets(0, 0, 0, 0).

Ví dụ: để tắt tính năng xử lý phần lồng ghép trên LargeTopAppBar, hãy đặt tham số windowInsets thành một thực thể trống:

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

Trước
Sử dụng ảnh động IME trên bàn phím
Tiếp
Sử dụng phần lồng ghép trong Khung hiển thị và Compose