Google は AI 技術を使用して、コンテンツをご希望の言語に翻訳しています。AI 翻訳には誤りが含まれる場合があります。

リストとページングを使用してデータを遅延読み込みする

遅延読み込みと Paging を使用すると、データを段階的に読み込んで表示することで、アプリでアイテムの多数のリスト（無限リストを含む）をサポートできます。この手法により、初期読み込み時間を短縮し、メモリ使用量を最適化して、パフォーマンスを向上させることができます。

結果

次の動画は、ユーザーがスクロールしたときにデータを取得する大きなリストの動作を示しています。

バージョンの互換性

この実装では、プロジェクトの 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)
            }
        }
    }
}LazyListSnippets.kt

コードに関する主なポイント

LazyColumn: このコンポーザブルは、アイテム（メッセージ）の大きなリストを効率的に表示するために使用されます。画面に表示されているアイテムのみをレンダリングするため、リソースとメモリを節約できます。
lazyPagingItems オブジェクトは、LazyColumn 内のページングされたデータの読み込みと表示を効率的に管理します。LazyColumn コンポーザブルの items に LazyPagingItems を渡します。
MessageRow(message: Text) は、個々のメッセージアイテムのレンダリングを担当し、メッセージの送信者とテキストを Card 内に表示します。
MessagePlaceholder() は、実際のメッセージデータの取得中に視覚的なプレースホルダ（読み込みスピナー）を表示し、ユーザーエクスペリエンスを向上させます。