Создайте конечный прокручиваемый список
Оптимизируйте свои подборки
Сохраняйте и классифицируйте контент в соответствии со своими настройками.
Прокручиваемые списки помогают управлять наборами данных, создавать адаптивные проекты и облегчать навигацию. Вы можете отображать меньшие наборы элементов в своем приложении, используя ограниченный список прокрутки. Чтобы избежать проблем с производительностью при работе с большими наборами данных или списками неизвестной длины, см. статью «Отложенная загрузка данных с помощью списков и разбиения по страницам» .
Совместимость версий
Для этой реализации требуется, чтобы в minSDK вашего проекта был установлен уровень API 21 или выше.
Зависимости
Создайте список с вертикальной прокруткой
Используйте следующий код для создания списка с вертикальной прокруткой:
@Composable
private fun ScrollBoxes() {
Column(
modifier = Modifier
.background(Color.LightGray)
.size(100.dp)
.verticalScroll(rememberScrollState())
) {
repeat(10) {
Text("Item $it", modifier = Modifier.padding(2.dp))
}
}
}
Ключевые моменты о коде
Результаты
Рисунок 1. Вертикально прокручиваемый список. Коллекции, содержащие это руководство
Это руководство является частью тщательно подобранной коллекции быстрых руководств, охватывающих более широкие цели разработки Android:
Отобразить список или сетку
Списки и сетки позволяют вашему приложению отображать коллекции в визуально приятной форме, удобной для использования пользователями.
Отображать интерактивные компоненты
Узнайте, как компонуемые функции позволяют легко создавать красивые компоненты пользовательского интерфейса на основе системы дизайна Material Design.
Основы создания композиции (коллекция видео)
В этой серии видеороликов представлены различные API Compose, быстро показано, что доступно и как их использовать.
Контент и образцы кода на этой странице предоставлены по лицензиям. Java и OpenJDK – это зарегистрированные товарные знаки корпорации Oracle и ее аффилированных лиц.
Последнее обновление: 2025-02-06 UTC.
[[["Прост для понимания","easyToUnderstand","thumb-up"],["Помог мне решить мою проблему","solvedMyProblem","thumb-up"],["Другое","otherUp","thumb-up"]],[["Отсутствует нужная мне информация","missingTheInformationINeed","thumb-down"],["Слишком сложен/слишком много шагов","tooComplicatedTooManySteps","thumb-down"],["Устарел","outOfDate","thumb-down"],["Проблема с переводом текста","translationIssue","thumb-down"],["Проблемы образцов/кода","samplesCodeIssue","thumb-down"],["Другое","otherDown","thumb-down"]],["Последнее обновление: 2025-02-06 UTC."],[],[],null,["\u003cbr /\u003e\n\nScrollable lists can help manage datasets, create responsive designs, and\nfacilitate navigation. You can display smaller sets of items in your app\nby using a finite scrolling list. To avoid performance issues with larger\ndatasets or a list of unknown length, see\n[Lazily load data with lists and Paging](/develop/ui/compose/quick-guides/content/lazily-load-list).\n\nVersion compatibility\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\nDependencies\n\nCreate a vertical scrolling list\n\nUse the following code to create a vertical scrolling list:\n\n\n```kotlin\n@Composable\nprivate fun ScrollBoxes() {\n Column(\n modifier = Modifier\n .background(Color.LightGray)\n .size(100.dp)\n .verticalScroll(rememberScrollState())\n ) {\n repeat(10) {\n Text(\"Item $it\", modifier = Modifier.padding(2.dp))\n }\n }\n}https://github.com/android/snippets/blob/7a0ebbee11495f628cf9d574f6b6069c2867232a/compose/snippets/src/main/java/com/example/compose/snippets/touchinput/gestures/GesturesSnippets.kt#L112-L124\n```\n\n\u003cbr /\u003e\n\nKey points about the code\n\n- Sets the [`Column`](/reference/kotlin/androidx/compose/foundation/layout/package-summary#Column(androidx.compose.ui.Modifier,androidx.compose.foundation.layout.Arrangement.Vertical,androidx.compose.ui.Alignment.Horizontal,kotlin.Function1)) scrolling behavior with the [`verticalScroll`](/reference/kotlin/androidx/compose/foundation/package-summary#(androidx.compose.ui.Modifier).verticalScroll(androidx.compose.foundation.ScrollState,kotlin.Boolean,androidx.compose.foundation.gestures.FlingBehavior,kotlin.Boolean)) modifier and the [`rememberScrollState`](/reference/kotlin/androidx/compose/foundation/package-summary#rememberScrollState(kotlin.Int)) function.\n- To create a horizontal scrolling list, create a [`Row`](/reference/kotlin/androidx/compose/foundation/layout/package-summary#Row(androidx.compose.ui.Modifier,androidx.compose.foundation.layout.Arrangement.Horizontal,androidx.compose.ui.Alignment.Vertical,kotlin.Function1)) with a [`horizontalScroll`](/reference/kotlin/androidx/compose/foundation/package-summary#(androidx.compose.ui.Modifier).horizontalScroll(androidx.compose.foundation.ScrollState,kotlin.Boolean,androidx.compose.foundation.gestures.FlingBehavior,kotlin.Boolean)) modifier.\n\nResults\n\n\u003cbr /\u003e\n\n**Figure 1.** A vertical scrolling list.\n\n\u003cbr /\u003e\n\nCollections that contain this guide\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\nDisplay a list or grid \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\nDisplay interactive components \nLearn how composable functions can enable you to easily create beautiful UI components based on the Material Design design system. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-interactive-components) \n\nCompose basics (video collection) \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 \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)"]]