Jetpack Compose with Resizable Background Image

701 Views Asked by At

Currently, I'm a bit stuck on having a resizable drawable in the background of a card.

 Card(
        modifier,
        shape = RoundedCornerShape(8.dp),
        elevation = 6.dp
    ) {
        Image(
            painterResource(...),
            contentScale = ContentScale.FillWidth,
            contentDescription = null,
            modifier = Modifier.fillMaxWidth()
        )
        Box() {
            Surface(
                color = Color.Transparent,
                contentColor = Color.White
            ) {

                Column(Modifier.padding(24.dp)) {
                    Spacer(Modifier.height(16.dp))
                    Text(...)
                    Spacer(Modifier.height(16.dp))
                    Text(...)
                    Spacer(Modifier.height(8.dp))
                    Text(...)
                    Spacer(Modifier.height(16.dp))
                    Button(...))
                    
                }
            }
        }

    }

What I really am trying to get is the image to resize accordingly to the contents of the card...but not doing that. Basically, it doesn't matter if the image is cropped, but I'm trying to make it fill the card. Right now, since I have FillWidth, on bigger screens like tablets, there is a large unused space at the bottom of the card. Any help would be much appreciated!

Tried replacing the whole card with a box instead, didn't work, different permutations of contentscale also did not help.

0

There are 0 best solutions below