Hi. How can I implement this button? I can implement the gradient of the button, but I don’t know ho...

# compose

[Luis Daivid]

Hi. How can I implement this button? I can implement the gradient of the button, but I don’t know how to implement the gradient shadow at the bottom.

[Zach Klippenstein (he/him) [MOD]]

Compose, and Android in general, doesn’t have native support for gradient shadows. You could probably simulate it by rendering the gradient in a layer with a blur effect and some transparency, but unless you pre-render it that will only work on newer android versions and might not be very performant.

[Tariyel Islami]

val gradient = Brush.horizontalGradient(
    colors = listOf(
        Color(0xFF673AB7),
        Color(0xFFE91E63)
    )
)



Box(
    contentAlignment = Alignment.Center,
    modifier = Modifier
        .size(height = 50.dp, width = 200.dp)
        .clip(RoundedCornerShape(50))
        .background(brush = gradient)
        .clickable {  }
) {
    Text(text = "Button")
}