How to remove border of card view with jetpack compose

user_10207110 0
Viewed 1328

I am facing the issue of border remove from card view in jetpack compose.
Kindly guide me on how to do achieve border removal from card view functionality.
My code is below but not working correctly.

Code

Card(
    shape = RoundedCornerShape(0.dp),
    border = BorderStroke(0.dp, Transparent),
    modifier = Modifier
        .height(100.dp)
        .padding(start = 10.dp, top = 40.dp, end = 10.dp)
        .border(0.dp, Transparent),
) {
    Column(
        modifier = Modifier
            .fillMaxWidth()
            .clickable {
                submit()
            },
    ) {
        Text(
            modifier = Modifier
                .weight(1f)
                .padding(start = 20.dp, top = 20.dp, bottom = 20.dp)
                .wrapContentWidth(Alignment.Start),
            text = "Submit",
            style = typography.h4,
        )
    }
}

enter image description here

android-jetpack-compose kotlin android
1 Answers

Actually, By default, there is no border in Card. What you are seeing is 1.dp elevation. So if you don't want any elevation make it 0.dp like the following.

Card(
    modifier = Modifier
        .height(100.dp)
        .padding(start = 10.dp, top = 40.dp, end = 10.dp),
    elevation = 0.dp
) {
    Your content..
}
user_132529810
Related