How can I draw a custom curved border around an el...
# composel
Lukasz Kalnik
11/19/2025, 10:52 AMHow can I draw a custom curved border around an element? I need to implement something like this 🧵
Lukasz Kalnik
11/19/2025, 10:53 AMimage.png
m
myanmarking
11/19/2025, 3:59 PMyou have to create a custom Shape for that. I did something similar. Easiest way, create a path with the bottom nav shape without the cutout. then subtract in the path the fab shape outline
l
Lukasz Kalnik
11/19/2025, 4:03 PMCan I subtract the FAB with the padding?
👍 1
m
myanmarking
11/19/2025, 4:04 PMuse fabShape.createOutline(...). add that to a path and use op(bottomNavShape). sth like that. last shape being the your bottom nav without the cutout
l
Lukasz Kalnik
11/19/2025, 4:05 PMThanks, I will try that!
Lukasz Kalnik
11/19/2025, 4:06 PMWhat is
op(bottomNavShape)Lukasz Kalnik
11/19/2025, 4:06 PMIs it subtraction?
r
romainguy
11/19/2025, 5:18 PMPath.op is the API in the platform, it was added to Compose 1.10 in beta or alpha. Instead you can use Path.minus (or just use the operator: path1 - path2)
thank you color 1
romainguy
11/19/2025, 6:26 PMNote that you can also build the shape yourself instead. Going down the route of boolean operations is basically as complicated since you'll have to build a shape that creates all those rounded corners
👍 1
l
Lukasz Kalnik
11/20/2025, 9:46 AMYes, it's probably cleaner to build it as an independent shape. Thank you!
7 Views