Danh sách trong Compose
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Khám phá các thành phần tải lười của Compose để dễ dàng hiển thị danh sách các mục.
Tìm hiểu cách hiển thị các loại mục khác nhau, triển khai tiêu đề cố định và kiểm soát hoặc phản ứng theo phương thức lập trình đối với các thay đổi về vị trí cuộn.
Điểm chính
- API
LazyColumn
được tạo dưới dạng DSL, khác với các bố cục khác trong Compose.
- Sử dụng
LazyColumn
để hiển thị các mục hiển thị trên màn hình.
- Sử dụng hàm
items()
để truyền các mục. Lambda xác định nội dung của từng mục, vì vậy, bạn có thể giữ lại mã hiện có.
- Để hiển thị nhiều loại mục, hãy sử dụng hàm
groupBy
.
Các bộ sưu tập chứa hướng dẫn này
Hướng dẫn này là một phần của các bộ sưu tập Hướng dẫn nhanh được tuyển chọn này, bao gồm các mục tiêu phát triển Android rộng hơn:
Hiển thị danh sách hoặc lưới
Danh sách và lưới cho phép ứng dụng của bạn hiển thị các bộ sưu tập ở dạng hình ảnh dễ nhìn và dễ sử dụng cho người dùng.
Kiến thức cơ bản về Compose (bộ sưu tập video)
Loạt video này giới thiệu nhiều API Compose, nhanh chóng cho bạn biết những API có sẵn và cách sử dụng các API đó.
Nội dung và mã mẫu trên trang này phải tuân thủ các giấy phép như mô tả trong phần Giấy phép nội dung. Java và OpenJDK là nhãn hiệu hoặc nhãn hiệu đã đăng ký của Oracle và/hoặc đơn vị liên kết của Oracle.
Cập nhật lần gần đây nhất: 2025-07-27 UTC.
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-07-27 UTC."],[],[],null,["# Lists in Compose\n\n\u003cbr /\u003e\n\nExplore Compose's lazy components, which make it easy to display lists of items.\nLearn how to show different item types, implement sticky headers, and\nprogrammatically control or react to the scroll-position changes. \n\nKey points\n----------\n\n- The [`LazyColumn`](/reference/kotlin/androidx/compose/foundation/lazy/package-summary#LazyColumn(androidx.compose.ui.Modifier,androidx.compose.foundation.lazy.LazyListState,androidx.compose.foundation.layout.PaddingValues,kotlin.Boolean,androidx.compose.foundation.layout.Arrangement.Vertical,androidx.compose.ui.Alignment.Horizontal,androidx.compose.foundation.gestures.FlingBehavior,kotlin.Boolean,kotlin.Function1)) API is built as a DSL, differing from other layouts in Compose.\n- Use `LazyColumn` to display items visible on screen.\n- Use the [`items()`](/reference/kotlin/androidx/compose/foundation/lazy/LazyListScope#items(kotlin.Int,kotlin.Function1,kotlin.Function1,kotlin.Function2)) function to pass items. The lambda defines the content of each of the items, so you can keep the existing code.\n- To display many different item types, use the `groupBy` function.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display a list or grid\n\nLists and grids allow your app to display collections in a visually pleasing form that's easy for users to consume. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-a-list-or-grid) \n\n### Compose basics (video collection)\n\nThis series of videos introduces various Compose APIs, quickly showing you what's available and how to use them. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/compose-basics) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]