JetpackCompose Material3 Button border override not working

Question

As the title says: Cannot override the border stroke for my Button composable. Below is my custom Button, how I invoke the composable by passing a border:BorderStroke parameter, and an image showing what it looks like.

@Composable
fun CustomButtonPrimary(
    onClick: () -> Unit,
    shape: RoundedCornerShape? = null,
    modifier: Modifier = Modifier,
    color: Color? = null,
    border: BorderStroke? = null,
    enabled: Boolean = true,
    content: @Composable RowScope.() -> Unit
){
    
    Button(
        onClick = onClick,
        modifier = modifier.height(30.dp),
        contentPadding = PaddingValues(top = 0.dp, bottom = 0.dp, start = 8.dp, end = 8.dp),
        shape = shape ?: MaterialTheme.shapes.small,
        enabled = enabled,
        colors = ButtonColors(
            containerColor = color ?: MaterialTheme.colorScheme.primary.copy(alpha = 0.8f),
            contentColor = if(color != null) Color.LightGray.copy(alpha = 0.75f) else MaterialTheme.colorScheme.surfaceVariant,
            disabledContainerColor = Color.DarkGray,
            disabledContentColor = Color.White
        ),
        border = border
    ) {
        ProvideTextStyle(value = MaterialTheme.typography.titleSmall) {
            content()
        }
    }
    
}

calling the Composable button like this:

CustomButtonPrimary(
    onClick = { ... },
    modifier = modifier
        .widthIn(95.dp, 120.dp)
        .height(20.dp),
    color = if(account.availableFunds <= 0) Color.DarkGray else null,
    border = BorderStroke(1.dp, Color.Red)
) {
    Text(text = btnText)
}

does not over-ride the original border. If you look at the image below. I have a border = Color.Red BEHIND my MaterialTheme coloring.... but I can't remove the green color and just show the red.

I've tried wrapping my Button in a Surface(){} with applied border styling.

I've also tried changing the Button.modifier = modifier.border() property

Scratching my head on this one, any suggestions?

Answer 1

I'm using your code but at compile time it's showing me how you want, with the red border, try to put it in your root of the app, maybe some value is making the border always green.