Nền tảng Android chịu trách nhiệm vẽ giao diện người dùng hệ thống, chẳng hạn như thanh trạng thái và thanh điều hướng. Giao diện người dùng hệ thống này được hiển thị bất kể ứng dụng mà người dùng đang sử dụng.
WindowInsets
cung cấp thông tin về hệ thống
để đảm bảo ứng dụng vẽ đúng vùng và giao diện người dùng không bị che khuất
theo giao diện người dùng hệ thống.
![Nhảy tràn sang hai bên để vẽ phía sau các thanh hệ thống](https://developer.android.google.cn/static/develop/ui/compose/images/layouts/insets/e2e-intro.gif?authuser=6&hl=vi)
Trên Android 14 (API cấp 34) trở xuống, giao diện người dùng của ứng dụng không vẽ ở bên dưới thanh hệ thống và vết cắt trên màn hình theo mặc định.
Trên Android 15 (API cấp 35) trở lên, ứng dụng vẽ bên dưới hệ thống thanh và vết cắt trên màn hình sau khi ứng dụng của bạn nhắm đến SDK 35. Điều này dẫn đến trải nghiệm người dùng liền mạch và cho phép ứng dụng của bạn tận dụng tối đa không gian cửa sổ hiện có.
Việc hiển thị nội dung phía sau giao diện người dùng hệ thống được gọi là hiện nội dung tràn viền. Về nội dung này bạn sẽ tìm hiểu về các loại phần lồng ghép khác nhau, cách quảng cáo tràn viền, cũng như cách sử dụng các API có phần lồng ghép để tạo ảnh động cho giao diện người dùng cũng như đảm bảo nội dung của ứng dụng không bị các phần tử trên giao diện người dùng hệ thống che khuất.
Nguyên tắc cơ bản có phần lồng ghép
Khi một ứng dụng có nội dung tràn viền, bạn cần đảm bảo rằng nội dung quan trọng và các hoạt động tương tác không bị giao diện người dùng hệ thống che khuất. Ví dụ: nếu một nút là được đặt sau thanh điều hướng, nên người dùng không thể nhấp vào nó.
Kích thước của giao diện người dùng hệ thống và thông tin về vị trí đặt giao diện người dùng được chỉ định thông qua phần lồng ghép.
Mỗi phần trên giao diện người dùng hệ thống có một loại phần lồng ghép tương ứng để mô tả kích thước và vị trí đặt quảng cáo. Ví dụ: phần lồng ghép thanh trạng thái cung cấp kích thước và vị trí của thanh trạng thái, trong khi các phần lồng ghép của thanh điều hướng cung cấp kích thước và vị trí của thanh điều hướng. Mỗi loại phần lồng ghép bao gồm bốn phần lồng ghép kích thước pixel: trên, trái, phải và dưới cùng. Các phương diện này xác định khoảng thời gian giao diện người dùng hệ thống mở rộng từ các cạnh tương ứng của cửa sổ ứng dụng. Cần tránh chồng chéo với loại giao diện người dùng hệ thống đó, do đó, giao diện người dùng ứng dụng phải được lồng ghép bằng loại giao diện đó số tiền.
Bạn có thể dùng các loại phần lồng ghép Android tích hợp sẵn sau đây thông qua WindowInsets
:
Các phần lồng ghép mô tả thanh trạng thái. Đây là các thanh giao diện người dùng hệ thống hàng đầu chứa biểu tượng thông báo và các chỉ báo khác. |
|
Các phần lồng ghép thanh trạng thái cho biết thời điểm các phần lồng ghép này hiển thị. Nếu thanh trạng thái hiện đang bị ẩn (do đang chuyển sang chế độ toàn màn hình chìm), thì các phần lồng ghép của thanh trạng thái chính sẽ trống nhưng các phần lồng ghép này sẽ không trống. |
|
Các phần lồng ghép mô tả các thanh điều hướng. Đây là các thanh giao diện người dùng hệ thống ở bên trái, bên phải hoặc dưới cùng của thiết bị, mô tả thanh tác vụ hoặc biểu tượng điều hướng. Các chỉ số này có thể thay đổi trong thời gian chạy dựa trên phương thức điều hướng mà người dùng ưu tiên và tương tác với thanh tác vụ. |
|
Phần lồng ghép thanh điều hướng cho biết thời điểm chúng hiển thị. Nếu các thanh điều hướng hiện đang bị ẩn (do đang chuyển sang chế độ toàn màn hình sống động) thì các phần lồng ghép của thanh điều hướng chính sẽ trống, nhưng các phần lồng ghép này sẽ không trống. |
|
Phần lồng ghép mô tả trang trí cửa sổ giao diện người dùng hệ thống nếu trong cửa sổ dạng tự do, chẳng hạn như thanh tiêu đề trên cùng. |
|
Phần lồng ghép thanh phụ đề cho biết thời điểm chúng hiển thị. Nếu thanh phụ đề hiện đang bị ẩn, thì các phần lồng ghép của thanh phụ đề chính sẽ trống nhưng các phần lồng ghép này sẽ không trống. |
|
Sự hợp nhất của các phần lồng ghép thanh hệ thống, bao gồm thanh trạng thái, thanh điều hướng và thanh phụ đề. |
|
Phần lồng ghép thanh hệ thống cho biết thời điểm các phần lồng ghép này hiển thị. Nếu thanh hệ thống hiện đang bị ẩn (do đang chuyển sang chế độ toàn màn hình chìm) thì các phần lồng ghép thanh hệ thống chính sẽ trống nhưng các phần lồng ghép này sẽ không trống. |
|
Các phần lồng ghép mô tả khoảng không gian ở dưới cùng mà bàn phím phần mềm chiếm. |
|
Các phần lồng ghép mô tả khoảng không gian mà bàn phím phần mềm chiếm trước hình động trên bàn phím hiện tại. |
|
Các phần lồng ghép mô tả khoảng không gian mà bàn phím phần mềm sẽ chiếm sau ảnh động hiện tại trên bàn phím. |
|
Một loại phần lồng ghép mô tả thông tin chi tiết hơn về giao diện người dùng điều hướng, cung cấp khoảng không gian cho thao tác "nhấn" sẽ do hệ thống xử lý chứ không phải ứng dụng. Đối với các thanh điều hướng trong suốt có tính năng thao tác bằng cử chỉ, bạn có thể nhấn vào một số phần tử trong ứng dụng thông qua giao diện người dùng thao tác trên hệ thống. |
|
Phần lồng ghép phần tử có thể nhấn vào để cho biết thời điểm hiển thị. Nếu các phần tử có thể nhấn đang bị ẩn (do đang chuyển sang chế độ toàn màn hình chìm), thì các phần lồng ghép của phần tử chính có thể nhấn sẽ bị trống, nhưng các phần lồng ghép này sẽ không trống. |
|
Các phần lồng ghép biểu thị số lượng phần lồng ghép mà hệ thống sẽ chặn các cử chỉ cho điều hướng. Các ứng dụng có thể chỉ định việc xử lý một số cử chỉ hạn chế thông qua |
|
Một số cử chỉ hệ thống sẽ luôn được hệ thống xử lý và bạn không thể chọn không sử dụng qua |
|
Các phần lồng ghép thể hiện khoảng cách cần thiết để tránh chồng chéo với vết cắt trên màn hình (lỗ cắt hoặc lỗ ghim). |
|
Các phần lồng ghép biểu thị các vùng cong của màn hình thác nước. Màn hình thác nước có các vùng cong dọc theo các cạnh của màn hình, nơi màn hình bắt đầu bao bọc dọc theo các cạnh của thiết bị. |
Các loại này được tóm tắt bằng 3 tiêu chí "an toàn" loại phần lồng ghép để đảm bảo nội dung bị làm mờ:
Các nhãn "an toàn" phần lồng ghép bảo vệ nội dung theo những cách khác nhau, dựa trên phần lồng ghép nền tảng cơ bản:
- Sử dụng
WindowInsets.safeDrawing
để bảo vệ nội dung không nên được vẽ bên dưới bất kỳ giao diện người dùng hệ thống nào. Đây là cách sử dụng phổ biến nhất của các phần lồng ghép: để ngăn chặn vẽ nội dung bị giao diện người dùng hệ thống che khuất (một phần hoặc hoàn toàn). - Dùng
WindowInsets.safeGestures
để bảo vệ nội dung bằng cử chỉ. Chiến dịch này tránh việc các cử chỉ hệ thống xung đột với các cử chỉ trong ứng dụng (chẳng hạn như các cử chỉ ở dưới cùng trang tính, băng chuyền hoặc trong trò chơi). - Sử dụng kết hợp
WindowInsets.safeContent
WindowInsets.safeDrawing
vàWindowInsets.safeGestures
để đảm bảo nội dung không bị chồng chéo hình ảnh và không có cử chỉ chồng chéo.
Thiết lập phần lồng ghép
Để cho phép ứng dụng của bạn kiểm soát hoàn toàn nơi ứng dụng vẽ nội dung, hãy làm theo các bước thiết lập sau bước. Nếu không thực hiện các bước này, ứng dụng của bạn có thể vẽ các màu đen hoặc màu đồng nhất phía sau giao diện người dùng hệ thống hoặc không tạo ảnh động đồng bộ bằng bàn phím phần mềm.
- Nhắm mục tiêu SDK 35 trở lên để thực thi tràn viền trên Android 15 trở lên. Ứng dụng của bạn hiển thị phía sau giao diện người dùng hệ thống. Bạn có thể điều chỉnh giao diện người dùng của ứng dụng bằng cách xử lý phần lồng ghép.
- Nếu muốn, hãy gọi
enableEdgeToEdge()
trongActivity.onCreate()
, cho phép ứng dụng của bạn hiển thị tràn viền trên Phiên bản Android. Đặt
android:windowSoftInputMode="adjustResize"
trong phần Hoạt động của bạn Mục nhậpAndroidManifest.xml
. Chế độ cài đặt này cho phép ứng dụng của bạn nhận được kích thước này của IME phần mềm dưới dạng phần lồng ghép mà bạn có thể sử dụng để đệm và bố trí nội dung thích hợp khi IME xuất hiện và biến mất trong ứng dụng của bạn.<!-- in your AndroidManifest.xml file: --> <activity android:name=".ui.MainActivity" android:label="@string/app_name" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.MyApplication" android:exported="true">
API Compose
Sau khi Hoạt động của bạn đã kiểm soát việc xử lý tất cả các phần lồng ghép, bạn có thể sử dụng Compose API nhằm đảm bảo nội dung không bị che khuất và các phần tử có thể tương tác trùng lặp với giao diện người dùng hệ thống. Các API này cũng đồng bộ hoá bố cục của ứng dụng với các thay đổi phần lồng ghép.
Ví dụ: đây là phương pháp cơ bản nhất để áp dụng các phần lồng ghép cho nội dung của toàn bộ ứng dụng:
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) enableEdgeToEdge() setContent { Box(Modifier.safeDrawingPadding()) { // the rest of the app } } }
Đoạn mã này áp dụng các phần lồng ghép cửa sổ safeDrawing
làm khoảng đệm xung quanh
toàn bộ nội dung của ứng dụng. Điều này đảm bảo rằng các phần tử có thể tương tác sẽ không
chồng lên giao diện người dùng hệ thống, điều đó cũng có nghĩa là sẽ không có ứng dụng nào vẽ phía sau
giao diện người dùng hệ thống để có được hiệu ứng tràn viền. Để tận dụng toàn bộ
bạn cần tinh chỉnh vị trí áp dụng các phần lồng ghép trên từng màn hình
hoặc theo từng thành phần.
Tất cả các loại phần lồng ghép này đều được tạo ảnh động tự động bằng ảnh động IME điều chỉnh cho phiên bản cũ về API 21. Theo tiện ích, tất cả bố cục sử dụng các phần lồng ghép này cũng tự động được tạo ảnh động khi các giá trị lồng ghép thay đổi.
Có hai cách chính để sử dụng các kiểu phần lồng ghép này để điều chỉnh Thành phần kết hợp bố cục: đối tượng sửa đổi khoảng đệm và đối tượng sửa đổi kích thước phần lồng ghép.
Đối tượng sửa đổi khoảng đệm
Modifier.windowInsetsPadding(windowInsets: WindowInsets)
áp dụng
Các phần lồng ghép cửa sổ cho trước làm khoảng đệm, hoạt động giống như Modifier.padding
sẽ thực hiện.
Ví dụ: áp dụng Modifier.windowInsetsPadding(WindowInsets.safeDrawing)
các phần lồng ghép bản vẽ an toàn làm khoảng đệm ở cả 4 cạnh.
Ngoài ra còn có một vài phương thức tiện ích tích hợp sẵn cho các loại phần lồng ghép phổ biến nhất.
Modifier.safeDrawingPadding()
là một phương thức như vậy, tương đương với
Modifier.windowInsetsPadding(WindowInsets.safeDrawing)
. Có các điểm tương đồng
đối tượng sửa đổi cho các loại phần lồng ghép khác.
Đối tượng sửa đổi kích thước lồng ghép
Các đối tượng sửa đổi sau đây áp dụng số lượng phần lồng ghép cửa sổ bằng cách đặt kích thước của thành phần là kích thước của các phần lồng ghép:
Áp dụng cạnh bắt đầu của windowInsets làm chiều rộng (như |
|
Áp dụng cạnh cuối của windowInsets làm chiều rộng (như |
|
Áp dụng chiều cao cho phần trên cùng của windowInsets làm chiều cao (như |
|
|
Áp dụng chiều cao cho cạnh dưới của windowInsets làm chiều cao (chẳng hạn như |
Các đối tượng sửa đổi này đặc biệt hữu ích khi định kích thước Spacer
chiếm
dấu cách của phần lồng ghép:
LazyColumn( Modifier.imePadding() ) { // Other content item { Spacer( Modifier.windowInsetsBottomHeight( WindowInsets.systemBars ) ) } }
Mức tiêu thụ lồng ghép
Đối tượng sửa đổi khoảng đệm có phần lồng ghép (windowInsetsPadding
và các trình trợ giúp như
safeDrawingPadding
) tự động sử dụng phần của các phần lồng ghép
được áp dụng làm khoảng đệm. Khi tìm hiểu sâu hơn về cây bố cục, phần lồng ghép lồng nhau
đối tượng sửa đổi khoảng đệm và đối tượng sửa đổi kích thước phần lồng ghép biết rằng một số phần của
Các phần lồng ghép đã được sử dụng bởi đối tượng sửa đổi khoảng đệm phần lồng ghép bên ngoài và tránh
sử dụng cùng một phần lồng ghép nhiều lần. Điều này sẽ dẫn đến việc
thừa nhiều không gian.
Công cụ sửa đổi kích thước lồng ghép cũng tránh sử dụng cùng một phần lồng ghép nhiều lần nếu các phần lồng ghép đã được sử dụng. Tuy nhiên, vì họ đang thay đổi chúng không sử dụng phần lồng ghép.
Do đó, đối tượng sửa đổi khoảng đệm lồng sẽ tự động thay đổi số lượng khoảng đệm được áp dụng cho mỗi thành phần kết hợp.
Trong cùng ví dụ về LazyColumn
như trước, LazyColumn
đang được
được đổi kích thước bằng đối tượng sửa đổi imePadding
. Bên trong LazyColumn
, mục cuối cùng là
có kích thước bằng chiều cao đáy của thanh hệ thống:
LazyColumn( Modifier.imePadding() ) { // Other content item { Spacer( Modifier.windowInsetsBottomHeight( WindowInsets.systemBars ) ) } }
Khi IME đóng, đối tượng sửa đổi imePadding()
sẽ không áp dụng khoảng đệm, vì
IME không có chiều cao. Vì đối tượng sửa đổi imePadding()
không áp dụng khoảng đệm,
không có phần lồng ghép nào được sử dụng và chiều cao của Spacer
sẽ là kích thước của
phía dưới cùng của các thanh hệ thống.
Khi IME mở, các phần lồng ghép IME sẽ tạo hiệu ứng động cho phù hợp với kích thước của IME và
Đối tượng sửa đổi imePadding()
bắt đầu áp dụng khoảng đệm dưới cùng để đổi kích thước
LazyColumn
khi IME mở. Khi đối tượng sửa đổi imePadding()
bắt đầu áp dụng
khoảng đệm dưới cùng, thì lệnh này cũng bắt đầu sử dụng số lượng phần lồng ghép đó. Do đó,
chiều cao của Spacer
bắt đầu giảm, như một phần của khoảng cách cho hệ thống
các thanh đã được đối tượng sửa đổi imePadding()
áp dụng. Khi
Đối tượng sửa đổi imePadding()
đang áp dụng một lượng khoảng đệm dưới cùng lớn hơn
so với các thanh hệ thống, chiều cao của Spacer
bằng 0.
Khi IME đóng, các thay đổi sẽ diễn ra theo chiều ngược lại: Spacer
bắt đầu thành
mở rộng từ độ cao bằng 0 khi imePadding()
đang áp dụng nhỏ hơn
cạnh dưới cùng của các thanh hệ thống, cho đến khi cuối cùng Spacer
khớp với chiều cao của
phía dưới cùng của các thanh hệ thống sau khi IME được tạo hiệu ứng động hoàn toàn.
TextField
.Hành vi này được thực hiện thông qua việc giao tiếp giữa tất cả
windowInsetsPadding
đối tượng sửa đổi và có thể bị ảnh hưởng trong một vài đối tượng sửa đổi khác
nhiều cách.
Modifier.consumeWindowInsets(insets: WindowInsets)
cũng sử dụng các phần lồng ghép
theo cách tương tự như Modifier.windowInsetsPadding
, nhưng không áp dụng
các phần lồng ghép đã tiêu thụ dưới dạng khoảng đệm. Điều này hữu ích khi kết hợp với phần lồng ghép
đối tượng sửa đổi kích thước, để cho các đồng cấp biết rằng một số phần lồng ghép nhất định có
đã được sử dụng:
Column(Modifier.verticalScroll(rememberScrollState())) { Spacer(Modifier.windowInsetsTopHeight(WindowInsets.systemBars)) Column( Modifier.consumeWindowInsets( WindowInsets.systemBars.only(WindowInsetsSides.Vertical) ) ) { // content Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.ime)) } Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.systemBars)) }
Modifier.consumeWindowInsets(paddingValues: PaddingValues)
hoạt động rất
tương tự như phiên bản có đối số WindowInsets
, nhưng sẽ lấy một giá trị
PaddingValues
tùy ý. Điều này rất hữu ích khi muốn thông báo
phần tử con khi khoảng đệm hoặc khoảng cách được cung cấp bởi một số cơ chế khác ngoài cơ chế
đối tượng sửa đổi khoảng đệm lồng ghép, chẳng hạn như Modifier.padding
thông thường hoặc chiều cao cố định
dấu cách:
@OptIn(ExperimentalLayoutApi::class) Column(Modifier.padding(16.dp).consumeWindowInsets(PaddingValues(16.dp))) { // content Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.ime)) }
Trong trường hợp cần các phần lồng ghép cửa sổ thô mà không cần tiêu thụ, hãy sử dụng
WindowInsets
trực tiếp hoặc sử dụng WindowInsets.asPaddingValues()
để
trả về PaddingValues
trong các phần lồng ghép không bị ảnh hưởng bởi việc sử dụng.
Tuy nhiên, do các lưu ý bên dưới, hãy ưu tiên sử dụng khoảng đệm phần lồng ghép cửa sổ
đối tượng sửa đổi và đối tượng sửa đổi kích thước phần lồng ghép cửa sổ bất cứ khi nào có thể.
Giai đoạn phần lồng ghép và giai đoạn Jetpack Compose
Compose sử dụng các API cốt lõi AndroidX cơ bản để cập nhật và tạo ảnh động cho các phần lồng ghép, API này sử dụng các API nền tảng cơ bản quản lý các phần lồng ghép. Nhờ nền tảng đó hành vi, phần lồng ghép có mối quan hệ đặc biệt với các giai đoạn của Jetpack Soạn thư.
Giá trị của các phần lồng ghép được cập nhật sau giai đoạn kết hợp, nhưng trước phần giai đoạn bố cục. Tức là việc đọc giá trị của các phần lồng ghép trong cấu trúc thường sử dụng giá trị của các phần lồng ghép trễ một khung hình. Tính năng tích hợp sẵn đối tượng sửa đổi được mô tả trên trang này được tạo để trì hoãn bằng cách sử dụng các giá trị của phần lồng ghép cho đến giai đoạn bố cục, giúp đảm bảo rằng các giá trị phần lồng ghép được sử dụng cùng một khung khi chúng được cập nhật.
Ảnh động IME trên bàn phím với WindowInsets
Bạn có thể áp dụng Modifier.imeNestedScroll()
cho một vùng chứa cuộn để mở và
tự động đóng IME khi cuộn xuống cuối vùng chứa.
class WindowInsetsExampleActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) WindowCompat.setDecorFitsSystemWindows(window, false) setContent { MaterialTheme { MyScreen() } } } } @OptIn(ExperimentalLayoutApi::class) @Composable fun MyScreen() { Box { LazyColumn( modifier = Modifier .fillMaxSize() // fill the entire window .imePadding() // padding for the bottom for the IME .imeNestedScroll(), // scroll IME at the bottom content = { } ) FloatingActionButton( modifier = Modifier .align(Alignment.BottomEnd) .padding(16.dp) // normal 16dp of padding for FABs .navigationBarsPadding() // padding for navigation bar .imePadding(), // padding for when IME appears onClick = { } ) { Icon(imageVector = Icons.Filled.Add, contentDescription = "Add") } } }
![Ảnh động hiển thị phần tử giao diện người dùng cuộn lên và xuống để nhường chỗ cho bàn phím](https://developer.android.google.cn/static/develop/ui/compose/images/interop-keyboard.gif?authuser=6&hl=vi)
Hỗ trợ phần lồng ghép cho các thành phần 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
)
tự xử lý các phần lồng ghép, dựa trên cách đặt các thành phần kết hợp trong ứng dụng
theo thông số kỹ thuật của Material.
Lồng ghép các thành phần kết hợp xử lý
Dưới đây là danh sách Material Các thành phần tự động xử lý các phần lồng ghép.
Thanh ứng dụng
TopAppBar
/SmallTopAppBar
/CenterAlignedTopAppBar
/MediumTopAppBar
/LargeTopAppBar
: Áp dụng các cạnh trên cùng và ngang của thanh hệ thống làm khoảng đệm vì thành phần này được sử dụng ở đầu cửa sổ.BottomAppBar
: Áp dụng các cạnh dưới cùng và ngang của thanh hệ thống làm khoảng đệm.
Vùng chứa nội dung
ModalDrawerSheet
/DismissibleDrawerSheet
/PermanentDrawerSheet
(nội dung bên trong ngăn điều hướng ở chế độ): Áp dụng phần lồng ghép dọc và bắt đầu cho nội dung.ModalBottomSheet
: Áp dụng các phần lồng ghép dưới cùng.NavigationBar
: Áp dụng các phần lồng ghép dưới cùng và ngang.NavigationRail
: Áp dụng các phần lồng ghép dọc và bắt đầu.
Scaffold
Theo mặc định,
Scaffold
cung cấp các 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; trách nhiệm này là của bạn.
Ví dụ: để sử dụng các phần lồng ghép này với 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 ) { items(count = 100) { Box( Modifier .fillMaxWidth() .height(50.dp) .background(colors[it % colors.size]) ) } } }
Ghi đè các 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 thành
đị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ổ để áp dụng hoặc tắt 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
!
đặt tham số windowInsets
thành một thực thể trống:
LargeTopAppBar( windowInsets = WindowInsets(0, 0, 0, 0), title = { Text("Hi") } )
Khả năng tương tác với các phần lồng ghép hệ thống Khung hiển thị
Bạn có thể cần phải ghi đè các phần lồng ghép mặc định khi màn hình có cả Chế độ xem và Mã Compose trong cùng một hệ phân cấp. Trong trường hợp này, bạn cần phải thể hiện rõ ràng trong cái nào nên sử dụng các phần lồng ghép và cái nào nên bỏ qua chúng.
Ví dụ: nếu bố cục ngoài cùng của bạn là một bố cục Khung hiển thị Android, bạn nên
sử dụng các phần lồng ghép trong hệ thống Khung hiển thị và bỏ qua chúng cho Compose.
Ngoài ra, nếu bố cục ngoài cùng là một thành phần kết hợp, bạn nên sử dụng
các phần lồng ghép trong Compose và đệm các thành phần kết hợp AndroidView
cho phù hợp.
Theo mặc định, mỗi ComposeView
sử dụng tất cả các phần lồng ghép tại
Mức tiêu thụ WindowInsetsCompat
. Để thay đổi hành vi mặc định này, hãy đặt
ComposeView.consumeWindowInsets
đến false
.
Tài nguyên
- Now in Android – một ứng dụng Android có đầy đủ chức năng được xây dựng hoàn toàn bằng Kotlin và Jetpack Compose.
- Xử lý các hoạt động thực thi tràn viền trong Android 15 — một lớp học lập trình hướng dẫn cách thực thi tràn viền của Android 15
- 3 điểm giúp cải thiện trải nghiệm của bạn trên ứng dụng Android: Edge to Edge, Xem trước thao tác quay lại và Glance — một video trên YouTube nói về việc thực thi tràn viền của Android 15
- Cạnh nhau và phần lồng ghép | Mẹo soạn thư — một video trên YouTube hướng dẫn cách xử lý các phần lồng ghép để vẽ tràn viền
Đề xuất cho bạn
- Lưu ý: văn bản có đường liên kết sẽ hiện khi JavaScript tắt
- Thành phần và bố cục Material
- Di chuyển
CoordinatorLayout
sang Compose - Những điểm khác cần cân nhắc