I am working on this design where I have a column that has text and image on top and I have this card view but I want to remove this white space. The card is white I just added the blue to show the white space showing. How can I remove the white space. I want the R.color.purple_700
to fill that space.
Here is my code
Column(
modifier = modifier
.fillMaxSize()
) {
Column(
modifier = modifier
.fillMaxWidth()
.background(colorResource(id = R.color.purple_700))
.weight(2.0f),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
// Do I add the box here?
Image(
painter = painterResource(id = R.drawable.ic_launcher_background),
contentDescription = "Logo"
)
Text(
text = "Sign in to Continue",
color = (colorResource(id = R.color.white)),
fontSize = 28.sp,
modifier = Modifier.padding(8.dp)
)
}
Card(
shape = RoundedCornerShape(topStart = 32.dp, topEnd = 32.dp),
modifier = modifier
.fillMaxWidth()
.weight(5.0f), elevation = 8.dp
) {
Column(
modifier = modifier
.fillMaxSize()
.padding(horizontal = 16.dp)
.scrollable(scrollState, Orientation.Vertical),
horizontalAlignment = Alignment.CenterHorizontally
) {
// then some outlinedText
}
Just add the background
modifier to the Card
.
Card(
modifier = Modifier.background(colorResource(id = R.color.purple_700))
//....
)