How to make a curved bottom app bar

[TahaMalas]

Hi!, I'm trying to implement this screenshot with bottom app bar, I didn't manage to make the SideCutClipper to be at the top of the bottom app bar any ideas?

[lohanidamodar]

For that you don't need custom clippers, just use ClipRRect for example

ClipRRect(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(20.0),
          topRight: Radius.circular(20.0)
        ),
              child: BottomAppBar(
          shape: CircularNotchedRectangle(),
          child: Container(
            height: kToolbarHeight,
          ),

        ),
      )

[TahaMalas]

For that you don't need custom clippers, just use ClipRRect for example

ClipRRect(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(20.0),
          topRight: Radius.circular(20.0)
        ),
              child: BottomAppBar(
          shape: CircularNotchedRectangle(),
          child: Container(
            height: kToolbarHeight,
          ),

        ),
      )

The solution you're suggesting is only for the curved top right and top left corners right? I'm asking for the curve on the selected tab in the bottom tab bar.

[lohanidamodar]

I think this is what you are looking for then,
https://github.com/rafalbednarczuk/curved_navigation_bar

[TahaMalas]

I think this is what you are looking for then,
https://github.com/rafalbednarczuk/curved_navigation_bar

Exactly, thank you so much, and sorry for the inconvenience

[lohanidamodar]

No problem! Glad to help!