Making three Card on Jetpack Compose, but only two are shown

Question

I try to build three different class cards. But why only two is shown?

Preview

Code:

   Scaffold(....){
    innerPadding ->
            BodyContent(Modifier.padding(innerPadding).fillMaxWidth())
        Card(shape = MaterialTheme.shapes.medium, modifier = Modifier.fillMaxWidth().padding(16.dp)) {
                Text("Card COntent")
            }
            Card(backgroundColor = MaterialTheme.colors.surface, shape = MaterialTheme.shapes.medium,
                    modifier = Modifier.fillMaxWidth()) {
                Text("Card COntent")
            }
            Card(Modifier.fillMaxWidth().padding(16.dp), elevation = 8.dp   ) {
                Text("Card COntent")
            }
    }

The first card is below the third card, so it's not visible. it's like FrameLayout, if you want to achieve more, try to use Row or Column or any other compose layout and add the cards. — Muthukrishnan Rajendran, Oct 16 '20 at 06:59

score 0 · Accepted Answer · answered Oct 16 '20 at 07:19

0

It is your screen:

The first card is covered by the third card.

Use something like:

   Column() {
        Card() {..}
        Card() {..}
        Card() {..}
    }

answered Oct 16 '20 at 07:19

Gabriele Mariotti

320,139
94
887
841

Making three Card on Jetpack Compose, but only two are shown

1 Answers1