How to set JetpackCompose Button Background Color

Question

I tried the code in background color on Button in Jetpack Compose

Button(
    onClick = {  },
    backgroundColor = Color.Yellow) {
}

but it doesn't recognize backgroundColor anymore.

I tried the below

Button(
    modifier = Modifier.background(Color.Yellow),
    onClick = { }){
}

Doesn't error out but the color is not setting

I'm using 1.0.0-alpha07 of Jetpack Compose. What's the way to set background color of the button?

Answer 1

Try this:

Button(
   onClick = {},
   colors = ButtonConstants.defaultButtonColors(backgroundColor = Color.Yellow)
) {
   /**/
}

Answer 2

You can use the ButtonDefaults.buttonColors using the backgroundColor property:

Something like:

Button(
     onClick = {  },
     colors = ButtonDefaults.buttonColors(
          backgroundColor = Color.Red)
)

Answer 3

In Material3:

It's changed a bit, you have to set containerColor to change background color.

Example:

    Button(
            onClick = { //todo },
            colors = ButtonDefaults.buttonColors(
                containerColor = Color.Yellow, // your background color
                contentColor = Color.Unspecified,// change text color
                disabledContainerColor = Color.Unspecified,
                disabledContentColor = Color.Unspecified
            ) 
        )

source: https://developer.android.com/reference/kotlin/androidx/compose/material3/ButtonDefaults#buttonColors(androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color)