17

I try to set the background color for the Material3 Card in Android Jetpack Compose, using the backgroundColor parameter.

implementation 'androidx.compose.material3:material3:1.0.0-alpha14'

// * Card with background color argument
            Card(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(16.dp),
                //set background color of the card
                backgroundColor = Color.Gray,
                content = {
                    Text("Card with background color argument", modifier = Modifier.padding(16.dp),style = MaterialTheme.typography.labelLarge)
                }
            )

i got error message : Cannot find a parameter with this name: backgroundColor enter image description here

Gabriele Mariotti
  • 320,139
  • 94
  • 887
  • 841
Bolt UIX
  • 5,988
  • 6
  • 31
  • 58

1 Answers1

49

You can do it like this:

Card(
    onClick = {},
    colors = CardDefaults.cardColors(
        containerColor = MaterialTheme.colorScheme.surfaceVariant,
    ),
    modifier = Modifier.fillMaxWidth()
)

You don't need to go through the modifier, just use containerColor.

leo
  • 113
  • 3
  • 11
Code Poet
  • 6,222
  • 2
  • 29
  • 50
  • 1
    You beat me to it:) When some default Composable has `colors`parameter answer is `XDefaults.xColors(...some colors)` to set colors. – Thracian Jul 24 '22 at 17:33
  • Lol, you are usually quick as lightning! :) – Code Poet Jul 24 '22 at 18:38
  • I know this color usage, but sometimes in some conditions of views, what ever I put as color it still show some wired color hat not come from my config to it. Any idea why? – Mahdi Nov 04 '22 at 06:48
  • If this answer or any other one solved your issue, please mark it as accepted – MiguelHincapieC Nov 21 '22 at 18:32