Quiero tener un archivo Lottie en la columna, pero el archivo Lottie viene sobre otros controles, podría solucionar el problema colocando el archivo Lottie dentro de la tarjeta
Ver el ejemplo
@Composable fun TileAnimation(modifier: Modifier = Modifier) { Card { Column { Text( text = "headline", modifier = Modifier .fillMaxWidth() ) val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.lottielogo)) // Card( // modifier = Modifier // .height(183.dp) // .then(modifier), // shape = RoundedCornerShape(0.dp) // ) { LottieAnimation( composition = composition, modifier = modifier .fillMaxWidth() .height(183.dp), contentScale = ContentScale.Crop, ) // } Box(modifier = Modifier.fillMaxWidth()) { Button( onClick = { }, modifier = Modifier .align(Alignment.Center) .wrapContentSize() ) { Text(text = "Button") } } } } }
Y el resultado como ven el texto está tapado ->
Y si descomentas la parte de la tarjeta, entonces se ve bien ->
Kotlin versión 1.6.10 y componer 1.1.0 y esta es la biblioteca lottie ->
implementation "com.airbnb.android:lottie-compose:4.2.2"
Por cierto, puede descargar el archivo Lottie desde aquí 1 : https://lottiefiles.com/96036-bored-cat
Quiero preguntar si mi solución es correcta, ¿o ustedes sugieren otro enfoque?
Todas las vistas en Compose por defecto no se recortan a los límites.
contentScale = ContentScale.Crop
solo determina la escala.
Para recortar el contenido al tamaño de la vista, especificado por otros modificadores, agregue Modifier.clip(RectangleShape)
a su vista.