使用列表和分页功能延迟加载数据

借助延迟加载和分页功能,您可以通过逐步加载和显示数据,在应用中支持包含大量列表项的列表(包括无限列表)。借助此技术,您可以缩短初始加载时间并优化内存用量,从而提升性能。

版本兼容性

此实现要求将项目 minSDK 设置为 API 级别 21 或更高级别。

依赖项

显示分页内容

借助 Paging 库,您可以加载和显示从本地存储空间或网络获取的更大数据集中的数据页面。使用以下代码显示分页列表,其中显示一个进度条,以向用户表明系统正在提取更多数据:

@Composable
fun MessageList(
    modifier: Modifier,
    pager: Pager<Int, Message>
) {
    val lazyPagingItems = pager.flow.collectAsLazyPagingItems()

    LazyColumn {
        items(
            lazyPagingItems.itemCount,
            key = lazyPagingItems.itemKey { it.id }
        ) { index ->
            val message = lazyPagingItems[index]
            if (message != null) {
                MessageRow(message)
            } else {
                MessagePlaceholder()
            }
        }
    }
    @Composable
    fun MessagePlaceholder(modifier: Modifier) {
        Box(
            Modifier
                .fillMaxWidth()
                .height(48.dp)
        ) {
            CircularProgressIndicator()
        }
    }

    @Composable
    fun MessageRow(
        modifier: Modifier,
        message: Message
    ) {
        Card(modifier = Modifier.padding(8.dp)) {
            Column(
                modifier = Modifier.padding(8.dp),
                verticalArrangement = Arrangement.Center
            ) {
                Text(message.sender)
                Text(message.text)
            }
        }
    }
}

代码要点

  • LazyColumn:此可组合项用于高效显示大量项(消息)的列表。它只会渲染屏幕上可见的内容,从而节省资源和内存。
  • lazyPagingItems 对象可高效地管理 LazyColumn 中分页数据的加载和呈现。它会将 LazyPagingItems 传递给 LazyColumn 可组合项中的 items
  • MessageRow(message: Text) 负责呈现各个消息项,可能会在卡片中显示消息的发件人和文本。
  • MessagePlaceholder() 会在提取实际消息数据时提供视觉占位符(一个加载旋转图标),从而提升用户体验。

结果

以下视频展示了在用户滚动时,大型列表提取数据的最终行为。

包含本指南的集合

本指南属于以下精选快速入门集合,这些集合涵盖了更广泛的 Android 开发目标:

借助列表和网格,您的应用可以以视觉上令人愉悦且易于用户使用的形式显示集合。
了解如何使用可组合函数根据 Material Design 设计系统轻松创建美观的界面组件。
本系列视频介绍了各种 Compose API,可让您快速了解可用 API 以及如何使用它们。

有问题或反馈

请访问我们的常见问题解答页面,了解简短指南,或与我们联系,告诉我们您的想法。