在这个演示应用程序中,我使用Jetpack Compose实现了Pageing3,但在ListContent中,我在将所有依赖项更新到最新版本后收到了这个错误,我try 将项和键传递为unsplashImage.id它看起来较新版本中的lazyColumn有不同的参数

enter image description here

这是我的ListContent文件

@ExperimentalCoilApi
@Composable
fun ListContent(items: LazyPagingItems<UnsplashImage>) {
    Log.d("Error", items.loadState.toString())
    LazyColumn(
        modifier = Modifier.fillMaxSize(),
        contentPadding = PaddingValues(all = 12.dp),
        verticalArrangement = Arrangement.spacedBy(12.dp)
    ) {
        items(
            items = items,
            key = { unsplashImage ->
                unsplashImage.id
            }
        ) { unsplashImage ->
            unsplashImage?.let { UnsplashItem(unsplashImage = it) }
        }
    }
}

@ExperimentalCoilApi
@Composable
fun UnsplashItem(unsplashImage: UnsplashImage) {
    val painter = rememberAsyncImagePainter(
        model = unsplashImage.urls.regular,
        error = painterResource(id = R.drawable.ic_placeholder),
        placeholder = painterResource(id = R.drawable.ic_placeholder)
    )
    val context = LocalContext.current
    Box(
        modifier = Modifier
            .clickable {
                val browserIntent = Intent(
                    Intent.ACTION_VIEW,
                    Uri.parse("https://unsplash.com/@${unsplashImage.user.username}?utm_source=DemoApp&utm_medium=referral")
                )
                ContextCompat.startActivity(context, browserIntent, null)
            }
            .height(300.dp)
            .fillMaxWidth(),
        contentAlignment = Alignment.BottomCenter
    ) {
        Image(
            modifier = Modifier.fillMaxSize(),
            painter = painter,
            contentDescription = "Unsplash Image",
            contentScale = ContentScale.Crop
        )
        Surface(
            modifier = Modifier
                .height(40.dp)
                .fillMaxWidth()
                .alpha(0.5F),
            color = Color.Black
        ) {}
        Row(
            modifier = Modifier
                .height(40.dp)
                .fillMaxWidth()
                .padding(horizontal = 6.dp),
            verticalAlignment = Alignment.CenterVertically,
            horizontalArrangement = Arrangement.SpaceBetween
        ) {
            Text(
                text = buildAnnotatedString {
                    append("Photo by ")
                    withStyle(style = SpanStyle(fontWeight = FontWeight.Black)) {
                        append(unsplashImage.user.username)
                    }
                    append(" on Unsplash")
                },
                color = Color.White,
                fontSize = MaterialTheme.typography.titleSmall.fontSize,
                maxLines = 1,
                overflow = TextOverflow.Ellipsis
            )
            LikeCounter(
                modifier = Modifier.weight(3f),
                painter = painterResource(id = R.drawable.ic_heart),
                likes = "${unsplashImage.likes}"
            )
        }
    }
}

@Composable
fun LikeCounter(
    modifier: Modifier,
    painter: Painter,
    likes: String
) {
    Row(
        modifier = modifier.fillMaxSize(),
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.End
    ) {
        Icon(
            painter = painter,
            contentDescription = "Heart Icon",
            tint = HeartRed
        )
        Divider(modifier = Modifier.width(6.dp))
        Text(
            text = likes,
            color = Color.White,
            fontSize = MaterialTheme.typography.titleLarge.fontSize,
            fontWeight = FontWeight.Bold,
            maxLines = 1,
            overflow = TextOverflow.Ellipsis
        )
    }
}

@ExperimentalCoilApi
@Composable
@Preview
fun UnsplashImagePreview() {
    UnsplashItem(
        unsplashImage = UnsplashImage(
            id = "1",
            urls = Urls(regular = ""),
            likes = 100,
            user = User(username = "Midomidoman", userLinks = UserLinks(html = ""))
        )
    )
}

和模型

@Serializable
@Entity(tableName = UNSPLASH_IMAGE_TABLE)
data class UnsplashImage(
    @PrimaryKey(autoGenerate = false)
    val id: String,
    @Embedded
    val urls: Urls,
    val likes: Int,
    @Embedded
    val user: User
)

推荐答案

正如在Paging Compose 1.0.0-alpha19 release notes中所解释的,分页合成API被更改为支持任何类型的延迟布局(而不仅仅是LazyColumnLazyRow).这意味着您将使用普通的items方法,该方法接受条目计数,并在LazyPagingItems上使用新的itemKey扩展方法.

因此,你应该遵循更新后的Paging Compose guide,将你的LazyColumn写成:

LazyColumn(
    modifier = Modifier.fillMaxSize(),
    contentPadding = PaddingValues(all = 12.dp),
    verticalArrangement = Arrangement.spacedBy(12.dp)
) {
    items(
        items.itemCount,
        key = lazyPagingItems.itemKey { unsplashImage ->
            unsplashImage.id
        }
    ) { index ->
        items[index]?.let { UnsplashItem(unsplashImage = it) }
    }
}

Android相关问答推荐

打开平板电脑的下载文件夹中的文件,例如使用其mimeType将Intent发送到我们的应用程序

Android意图过滤器不限制应用程序仅处理YouTube链接

懒惰的垂直网格中盒子的重量-Jetpack组合

Jetpack编写错误(java.lang.NoSuchMethodError:无接口方法startRestartGroup)

使用Kotline绑定时,ViewHolder无法识别文本视图

使用 List 和 LazyColumn 重新组合所有项目

在java android studio项目上安装mapbox

是否可以在 compose 中使用三次贝塞尔曲线进行动画?

具有数据库和升级潜力的移动应用程序开发(Android)供朋友使用

用作输入参数的 Lambda 函数导致重组

为什么集成React Native时compileSdkVersion错误?

在 Jetpack Compose 中包装内容

组成不重叠的元素

Jetpack compose 未解决的参考错误

是什么让 Android Studio 中的按钮变成紫色?加上新手的其他奇怪行为

如何从我的 android 应用程序中删除 QUERY_ALL_PACKAGES 权限?

如何使用文件提供程序将视频从一个应用程序共享到另一个应用程序?

如何在stroke android drawable中设置渐变

如何使伴奏导航 BottomSheet 完全展开?

如何在 Kotlin 中使用反向绑定适配器将小写文本转换为大写?