Skip to content

Crossfading between two data source #3473

Description

@tymmesyde

Describe the bug
Using crossfade(), when the data source is changing, it will only crossfade when the image is loading, once it's loaded it will just not transition
Read about useExistingImageAsPlaceholder that could potentially fix this issue, but it seems to behaves the same with or without it
So i'm not sure i'm using it correctly, is there a way to fix this behavior?

To Reproduce

@OptIn(ExperimentalCoilApi::class)
@Composable
private fun Background(
    url: String?,
) {
    val context = LocalContext.current

    Box(
        Modifier
            .fillMaxWidth()
            .height(330.dp),
        contentAlignment = Alignment.TopEnd,
    ) {
        Box(Modifier.fillMaxWidth(0.7f)) {
            AsyncImage(
                modifier = Modifier
                    .fillMaxSize()
                    .startToEndGradientMask(0f, 1f)
                    .bottomToTopGradientMask(0.7f, 1f),
                model = ImageRequest.Builder(context)
                    .data(url)
                    .crossfade(250)
                    .useExistingImageAsPlaceholder(true)
                    .build(),
                contentDescription = null,
                contentScale = ContentScale.Crop,
            )
        }
    }
}

Version
3.5 on Android 14

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions