CODEWITHSUNDEEP
android-jetpack-compose
Unknown
Unknown

Reputation: 25

How to create custom shapes in Jetpack Compose?

I am trying to create this shape using canvas enter image description here

Upvotes: 2

Views: 1970

Answers (1)

Phil Dukhov
Phil Dukhov

Reputation: 87605

You can subclass Shape interface, and implement createOutline method. Outline.Generic accepts any Path object, so you can build any shape by adding lines, curves, rounded rects, etc.

class CustomShape(val param: Int): Shape {
    override fun createOutline(
        size: Size,
        layoutDirection: LayoutDirection,
        density: Density,
    ) = Outline.Generic(Path().apply {
        // build your path here depending on params and size
    })
}

If the shape has no parameters, it can be defined as object instead of class.

Then you can pass this custom shape in any modifier which accepts Shape, like Modifier.background(color, shape = CustomShape(...)), border, or in views like Surface.

Upvotes: 3

Related Questions