Shared Elem - Details Text

shared_elem_details_text.kt

@Composable
fun SharedTransitionScope.DetailsScreen(
    url: String,
    animatedVisibilityScope: AnimatedVisibilityScope,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
) {
    Column(
        modifier = modifier
            .clickable(
                interactionSource = remember { MutableInteractionSource() },
                indication = null,
                onClick = onClick
            ),
        verticalArrangement = Arrangement.spacedBy(16.dp)
    ) {
        AsyncImage(
            model = url,
            modifier = Modifier
                .fillMaxWidth()
                .aspectRatio(4f / 3f)
                .sharedElement(
                    rememberSharedContentState(key = "image-$url"),
                    animatedVisibilityScope,
                ),
            contentDescription = null,
        )
        LoremIpsum(
            modifier = Modifier
                .fillMaxWidth()
                .padding(horizontal = 16.dp)
                // 1
                .sharedElement(
                    rememberSharedContentState(
                        key = "text-$url"
                    ),
                    animatedVisibilityScope,
                )
        )
    }
}