0

我正在显示Image()从 compose 中的 URL 加载的内容，效果很好。当我从服务器获取图像时，我希望用户看到一个圆形微调器，以便他知道有什么东西要来了。加载图像后，微调器应替换为加载的图像。问题是即使在收到 URL Image 后，仍然需要几秒钟才能在屏幕上呈现实际的位图。目前，我只是将 theImage和 aCircularProgressIndicator相互重叠放在 a 中Box。这样，图像一旦加载，就会简单地与进度微调器重叠，并给人一种“加载完成”的印象。我基本上是在“假装”，因为微调器仍然在图像后面。

我的问题是这种方法是否是推荐的方法，或者是否有任何负面的性能影响，因为 afaic 微调器仍然会在图像后面转动。有谁知道更好/更正确的方法？到目前为止，我还没有OnRenderingComplete在可组合中看到任何回调。Image

这是我的代码

Box(modifier =Modifier.padding(2.dp), contentAlignment = Alignment.Center ){
    CircularProgressIndicator(modifier = Modifier
            .size(44.dp)
            .padding(3.dp),
        color = Color.White)
    Image(
        painter = rememberImagePainter(URL),
        contentDescription = null,
        modifier = Modifier
            .size(50.dp)
            .clip(CircleShape)
    )
}

TL;博士

在我看来，当屏幕上只有一个微调器和图像时，我的方法相对无害（它的简单性甚至可能使其合理）但我问自己，如果我在LazyColumn每个图像上使用这种方法，它是否也可以工作排。

4

1 回答 1

1

使用 a 的方法Box完全没问题，但是您可以使用painter state 仅在它像这样加载时显示指示器：

val painter = rememberImagePainter(URL)
if (painter.state is ImagePainter.State.Loading) {
    CircularProgressIndicator(Modifier)
}
Image(
    painter = painter,
    contentDescription = null,
    modifier = Modifier
)
于 2022-02-15T14:38:25.033 回答