Custom Shape with Jetpack Compose

After exploring the <a href="https://medium.com/google-developer-experts/exploring-jetpack-compose-canvas-the-power-of-drawing-8cc60815babe" rel="noopener">Jetpack Compose Canvas</a> in a previous article, this new post will explain how you can draw and use a custom <a href="https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Shape" rel="noopener ugc nofollow" target="_blank">Shape</a> for your Composables to give them a specific outline. The Jetpack Compose foundation library already provides common shapes but we’ll see how to take advantage of the <a href="https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/Path" rel="noopener ugc nofollow" target="_blank">Path</a> API to build custom outlines. We will go even further by adding some animations to our brand new shapes. <h1>Introduction to Shape</h1> With Jetpack Compose, it is easy to add some rounded or cut corners to your Composable thanks to the foundation library which provides several shapes: <ul> <li>RoundedCornerShape(): to have a rounded corner outline with a given radius</li> <li>CutCornerShape(): to have a cut corner outline with a given size</li> <li>GenericShape(): to build custom outlines with a given Path</li> </ul> <a href="https://juliensalvi.medium.com/custom-shape-with-jetpack-compose-1cb48a991d42">Click Here</a>