Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
RecyclerView to komponent View, który ułatwia efektywne wyświetlanie dużych zbiorów danych. Zamiast tworzyć widoki dla każdego elementu w zbiorze danych, RecyclerViewzwiększa wydajność aplikacji, utrzymując małą pulę widoków i wykorzystując je ponownie podczas przewijania tych elementów.
W Compose możesz użyć list leniwych, aby osiągnąć ten sam efekt. Na tej stronie opisujemy, jak przenieść implementację RecyclerView, aby używać list leniwych w Compose.
Etapy migracji
Aby przenieść implementację RecyclerView do Compose, wykonaj te czynności:
Zakomentuj lub usuń element RecyclerView z hierarchii interfejsu i dodaj element ComposeView, jeśli nie ma go jeszcze w hierarchii. Oto kontener listy leniwej, który dodasz:
Określ, jakiego typu funkcji kompozycyjnej Lazy list potrzebujesz, na podstawie menedżera układu RecyclerView (patrz tabela poniżej). Wybrany komponent będzie komponentem najwyższego poziomu w ComposeView dodanym w poprzednim kroku.
LayoutManager
Kompozycyjne
LinearLayoutManager
LazyColumn lub LazyRow
GridLayoutManager
LazyVerticalGrid lub LazyHorizontalGrid
StaggeredGridLayoutManager
LazyVerticalStaggeredGrid lub LazyHorizontalStaggeredGrid
// recyclerView.layoutManager = LinearLayoutManager(context)composeView.setContent{LazyColumn(Modifier.fillMaxSize()){// We use a LazyColumn since the layout manager of the RecyclerView is a vertical LinearLayoutManager}}
Utwórz odpowiedni komponent kompozycyjny dla każdego typu widoku w swoim wdrożeniuRecyclerView.Adapter. Każdy typ widoku jest zwykle mapowany na podklasę ViewHolder, ale nie zawsze tak jest. Te komponenty kompozycyjne będą używane jako reprezentacja interfejsu różnych typów elementów na liście:
@ComposablefunListItem(data:MyData,modifier:Modifier=Modifier){Row(modifier.fillMaxWidth()){Text(text=data.name)// … other composables required for displaying `data`}}
Logika w metodach RecyclerView.AdapteronCreateViewHolder() i onBindViewHolder() zostanie zastąpiona przez te funkcje kompozycyjne i stan, który im przekazujesz. W Compose nie ma rozróżnienia między tworzeniem komponentu do wyświetlania elementu a powiązaniem z nim danych – te pojęcia są połączone.
W content gnieździe listy Lazy (ostatni parametr lambda) użyj funkcji items() (lub równoważnego przeciążenia), aby iterować po danych na liście. W funkcji lambda itemContent wywołaj odpowiedni element kompozycyjny dla swoich danych:
RecyclerView ma koncepcję ItemDecoration, której możesz użyć, aby dodać specjalny rysunek do elementów na liście. Możesz na przykład dodać znak ItemDecoration, aby rozdzielić elementy:
Compose nie ma odpowiednika dekoracji elementów. Zamiast tego możesz dodać dowolne elementy dekoracyjne interfejsu bezpośrednio w kompozycji. Aby na przykład dodać separatory do listy, możesz użyć funkcji kompozycyjnej Divider po każdym elemencie:
ItemAnimator można ustawić na RecyclerView, aby animować wygląd elementów w miarę wprowadzania zmian w adapterze. Domyślnie RecyclerView używa DefaultItemAnimator, która zapewnia podstawowe animacje podczas usuwania, dodawania i przenoszenia zdarzeń.
Listy leniwe mają podobną koncepcję dzięki modyfikatorowi animateItemPlacement.
Więcej informacji znajdziesz w sekcji Animacje elementów.
Dodatkowe materiały
Więcej informacji o migracji RecyclerView do Compose znajdziesz w tych materiałach:
Listy i siatki: dokumentacja dotycząca implementowania list i siatek w Compose.
Treść strony i umieszczone na niej fragmenty kodu podlegają licencjom opisanym w Licencji na treści. Java i OpenJDK są znakami towarowymi lub zastrzeżonymi znakami towarowymi należącymi do firmy Oracle lub jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-08-22 UTC.
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 2025-08-22 UTC."],[],[],null,["[`RecyclerView`](/develop/ui/views/layout/recyclerview) is a View component that makes it easy to efficiently display\nlarge sets of data. Instead of creating views for each item in the data set,\n`RecyclerView` improves the performance of your app by keeping a small pool of\nviews and recycling through them as you scroll through those items.\n\nIn Compose, you can use [Lazy lists](/develop/ui/compose/lists#lazy) to accomplish the same thing. This page\ndescribes how you can migrate your `RecyclerView` implementation to use Lazy lists\nin Compose.\n\nMigration steps\n\nTo migrate your `RecyclerView` implementation to Compose, follow these steps:\n\n1. Comment out or remove the `RecyclerView` from your UI hierarchy and add a\n `ComposeView` to replace it if none is present in the hierarchy yet. This\n is the container for the Lazy list that you'll add:\n\n \u003cFrameLayout\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\u003e\n\n \u003c!-- \u003candroidx.recyclerview.widget.RecyclerView--\u003e\n \u003c!-- android:id=\"@+id/recycler_view\"--\u003e\n \u003c!-- android:layout_width=\"match_parent\"--\u003e\n \u003c!-- android:layout_height=\"match_parent /\u003e\"--\u003e\n\n \u003candroidx.compose.ui.platform.ComposeView\n android:id=\"@+id/compose_view\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\" /\u003e\n\n \u003c/FrameLayout\u003e\n\n2. Determine what type of Lazy list composable you need based on your\n `RecyclerView`'s layout manager (see table below). The composable you select\n will be the top-level composable of the `ComposeView` you added in the\n previous step.\n\n | `LayoutManager` | Composable |\n |------------------------------|--------------------------------------------------------------|\n | `LinearLayoutManager` | `LazyColumn` or `LazyRow` |\n | `GridLayoutManager` | `LazyVerticalGrid` or `LazyHorizontalGrid` |\n | `StaggeredGridLayoutManager` | `LazyVerticalStaggeredGrid` or `LazyHorizontalStaggeredGrid` |\n\n\n ```kotlin\n // recyclerView.layoutManager = LinearLayoutManager(context)\n composeView.setContent {\n LazyColumn(Modifier.fillMaxSize()) {\n // We use a LazyColumn since the layout manager of the RecyclerView is a vertical LinearLayoutManager\n }\n }https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/interop/MigrationCommonScenariosSnippets.kt#L79-L84\n ```\n\n \u003cbr /\u003e\n\n3. Create a corresponding composable for each view type in your\n `RecyclerView.Adapter` implementation. Each view type typically maps to a\n `ViewHolder` subclass, though this may not always be the case. These\n composables will be used as the UI representation for different types of\n elements in your list:\n\n\n ```kotlin\n @Composable\n fun ListItem(data: MyData, modifier: Modifier = Modifier) {\n Row(modifier.fillMaxWidth()) {\n Text(text = data.name)\n // ... other composables required for displaying `data`\n }\n }https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/interop/MigrationCommonScenariosSnippets.kt#L124-L130\n ```\n\n \u003cbr /\u003e\n\n The logic in your `RecyclerView.Adapter`'s `onCreateViewHolder()` and\n `onBindViewHolder()` methods will be replaced by these composables and the\n state that you provide them with. In Compose, there is no separation between\n creating a composable for an item and binding data into it---these concepts are\n coalesced.\n4. Within the `content` slot of the Lazy list (the trailing lambda parameter),\n use the `items()` function (or an equivalent overload) to iterate through the\n data for your list. In the `itemContent` lambda, invoke the appropriate\n composable item for your data:\n\n\n ```kotlin\n val data = listOf\u003cMyData\u003e(/* ... */)\n composeView.setContent {\n LazyColumn(Modifier.fillMaxSize()) {\n items(data) {\n ListItem(it)\n }\n }\n }https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/interop/MigrationCommonScenariosSnippets.kt#L90-L97\n ```\n\n \u003cbr /\u003e\n\n| **Tip:** Provide additional parameters to `items()` to optimize your list: use the `key` parameter to provide a unique key for the underlying data so that scroll position will be maintained when items change, or use the `contentType` parameter to specify a content type for the underlying data (this is a similar concept to `RecyclerView`'s view types) so you can reuse item compositions more efficiently.\n\nCommon use cases\n\nItem decorations\n\n`RecyclerView` has the concept of an `ItemDecoration`, which you can use to add a\nspecial drawing for items in the list. For example, you can add an\n`ItemDecoration` to add dividers between items:\n\n\n```kotlin\nval itemDecoration = DividerItemDecoration(recyclerView.context, LinearLayoutManager.VERTICAL)\nrecyclerView.addItemDecoration(itemDecoration)https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/interop/MigrationCommonScenariosSnippets.kt#L103-L104\n```\n\n\u003cbr /\u003e\n\nCompose does not have an equivalent concept of item decorations. Instead, you\ncan add any UI decorations in the list directly in the composition. For example,\nto add dividers to the list, you can use the `Divider` composable after each\nitem:\n\n\n```kotlin\nLazyColumn(Modifier.fillMaxSize()) {\n itemsIndexed(data) { index, d -\u003e\n ListItem(d)\n if (index != data.size - 1) {\n HorizontalDivider()\n }\n }\n}https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/interop/MigrationCommonScenariosSnippets.kt#L111-L118\n```\n\n\u003cbr /\u003e\n\nItem animations\n\nAn `ItemAnimator` can be set on a `RecyclerView` to animate the appearance of\nitems as changes are made to the adapter. By default, `RecyclerView` uses\n[`DefaultItemAnimator`](/reference/androidx/recyclerview/widget/DefaultItemAnimator) which provides basic animations on remove, add, and\nmove events.\n\nLazy lists have a similar concept through the `animateItemPlacement` modifier.\nSee [Item animations](/develop/ui/compose/lists#item-animations) to learn more.\n\nAdditional resources\n\nFor more information about migrating a `RecyclerView` to Compose, see the\nfollowing resources:\n\n- [Lists and Grids](/develop/ui/compose/lists#item-animations): Documentation for how to implement lists and grids in Compose.\n- [Jetpack Compose Interop: Using Compose in a RecyclerView](https://medium.com/androiddevelopers/jetpack-compose-interop-using-compose-in-a-recyclerview-569c7ec7a583): Blog post for efficiently using Compose within a `RecyclerView`.\n\nRecommended for you\n\n- Note: link text is displayed when JavaScript is off\n- [Lists and grids](/develop/ui/compose/lists)\n- [Migrate `CoordinatorLayout` to Compose](/develop/ui/compose/migrate/migration-scenarios/coordinator-layout)\n- [Other considerations](/develop/ui/compose/migrate/other-considerations)"]]
