Agregué una imagen dentro de una tarjeta con un color de fondo y quiero que una parte de mi imagen se desborde fuera del contenedor y sea visible. Usé offset para compensar la imagen pero no puedo encontrar la manera de hacerla visible.
Aquí está mi código:
Card( shape = RoundedCornerShape(8.dp), modifier = Modifier.padding(), backgroundColor = Color.Cyan, onClick = {}, ) { Box(modifier = Modifier.wrapContentHeight()) { Image( modifier = Modifier .width(250.dp) .align(alignment = Alignment.TopEnd) .offset(y = -75.dp, x = 50.dp), painter = painterResource(id = R.drawable.ic_pray), contentDescription = null, ) Column( ) {} } }La Card se basa en la superficie del material y usa Modifier.clip que evita que se muestre la vista de desplazamiento.
Si necesita mantener la elevación de la Card , puede colocar la imagen en un Box fuera de Card :
Box { Card(...) Image( modifier = Modifier .width(250.dp) .align(alignment = Alignment.TopEnd) .offset(y = -75.dp, x = 50.dp), painter = painterResource(id = R.drawable.my_image), contentDescription = null, ) } De lo contrario, puede omitir el uso de la Card en primer lugar y establecer el fondo y la forma de su Box con Modifier.background :
Box( modifier = Modifier .padding(10.dp) .background(Color.Cyan, shape = RoundedCornerShape(8.dp)) ) { Box(modifier = Modifier.wrapContentHeight()) { Image( modifier = Modifier .width(250.dp) .align(alignment = Alignment.TopEnd) .offset(y = -75.dp, x = 50.dp), painter = painterResource(id = R.drawable.my_image), contentDescription = null, ) Column( ) {} } }