Предварительная загрузка изображений в Coil-Jetpack Compose ⇐ Android

[Anonymous]

Я использую lazycolumn для отображения количества изображений с помощью катушки, скажем, 10 изображений,
когда я достигаю конца lazycolumn, я получаю еще 10 изображений,
но изображения еще не загружены из сети и изображения имеют плавное затухание, которое мне не нужно,
есть ли способ заставить изображения загружаться
после кэширования всех новых входящих изображений, чтобы я мог видеть полностью видимые изображения вместо перекрестного затухания или заполнителя...
я хочу получить поведение прокрутки в приложениях социальных сетей, таких как Instagram.
когда мы прокручиваем вниз, если элементы заканчиваются, мы не видим заполнителя или crossfade,
вместо этого мы видим индикатор загрузки до тех пор, пока все данные не будут кэшированы, он будет виден нам, когда они будут кэшированы,
и после того, как они будут кэшированы, даже если количество элементов в этом ленивом столбце их слишком много, мы все еще можем видеть изображения вверху (когда я прокручиваю нижнюю часть и возвращаюсь наверх, я вижу, что в моем случае изображения перезагружаются из сети)

@Composable
fun ProductScreen(
viewModel: ViewModel = hiltViewModel()
) {
val products by viewModel.products.collectAsStateWithLifecycle()
val isLoading by viewModel.isLoading.collectAsStateWithLifecycle()

val listState = rememberLazyListState()
val shouldLoadMore = remember {
derivedStateOf {
val totalITemsCount = listState.layoutInfo.totalItemsCount
val lastVisibleItemIndex =
listState.layoutInfo.visibleItemsInfo.lastOrNull()?.index ?: 0
!isLoading && lastVisibleItemIndex >= totalITemsCount - 1
}
}

LaunchedEffect(shouldLoadMore.value) {
if (shouldLoadMore.value) {
val totalItemCount = listState.layoutInfo.totalItemsCount
viewModel.loadMoreProducts(totalItemCount)
}
}
val context = LocalContext.current

LazyColumn(
modifier = Modifier
.fillMaxSize()
.padding(horizontal = 16.dp),
state = listState,
verticalArrangement = Arrangement.spacedBy(5.dp)
) {
items(products) { product ->
ProductCard(product, context = context)
}
if (isLoading) {
item {
Box(Modifier.fillMaxWidth(), contentAlignment = Alignment.Center) {
CircularProgressIndicator()
}
}
}
}
}

@Composable
fun ProductCard(product: Product, context: Context) {
Card(
modifier = Modifier
.fillMaxWidth()
.padding(12.dp)
.aspectRatio(1f)
.border(1.dp, Color.Blue.copy(alpha = 0.3f), shape = RoundedCornerShape(6.dp))
) {
AsyncImage(
model = ImageRequest.Builder(context)
.data(product.imageUrl)
.crossfade(false)
.build(),
contentDescription = "",
modifier = Modifier.fillMaxSize(),

)
}
}


Подробнее здесь: https://stackoverflow.com/questions/790 ... ck-compose