<https://stackoverflow.com/questions/67474260/how-...

# compose

[Nurseyit Tursunkulov]

https://stackoverflow.com/questions/67474260/how-to-create-textfield-in-compose

[Cicero]

I don’t understand what exactly you want to do

[Denis Capkovic]

If you are asking for the inner shadow in the Text fields, as far as I can tell there is no way (without drawing it on canvas yourself) of doing this right now.

You can resort to using multiple gradients with .drawBehind but with rounded corners it doesn’t look right. If you happen to found a solution please share 🙂.

This was my attempt with normal Brush gradients.

.drawBehind {
    val insetValue = size.height * 0.05f
    val cornerRadius = 10.dp
    inset(insetValue) {
        val gradientLength = size.height * 0.12f
        val rectangleHeight = size.height
        val rectangleWidth = size.width

        val borderRadius = cornerRadius.value * 2f
        val gradientColor = Grey800

        // Left
        drawRoundRect(
            cornerRadius = CornerRadius(borderRadius),
            brush = Brush.horizontalGradient(
                Pair(0f, gradientColor),
                Pair(gradientLength, Color.Transparent),
                startX = 0f,
                endX = gradientLength,
            ),
            size = Size(rectangleWidth, rectangleHeight)
        )

        // Top
        drawRoundRect(
            cornerRadius = CornerRadius(borderRadius),
            brush = Brush.verticalGradient(
                Pair(0f, gradientColor),
                Pair(gradientLength, Color.Transparent),
                startY = 0f,
                endY = gradientLength,
            ),
            size = Size(rectangleWidth, rectangleHeight)
        )

        // Right
        drawRoundRect(
            cornerRadius = CornerRadius(borderRadius),
            brush = Brush.horizontalGradient(
                Pair(0f, gradientColor),
                Pair(gradientLength, Color.Transparent),
                startX = size.width,
                endX = size.width - gradientLength,
            ),
            size = Size(rectangleWidth, rectangleHeight)
        )

        // Bottom
        drawRoundRect(
            cornerRadius = CornerRadius(borderRadius),
            brush = Brush.verticalGradient(
                Pair(0f, gradientColor),
                Pair(gradientLength, Color.Transparent),
                startY = size.height,
                endY = size.height - gradientLength,
            ),
            size = Size(rectangleWidth, rectangleHeight)
        )
    }
}

[Cicero]

How did you saw an inner shadow there 😂

[Cicero]

Now I got it