Rounded border

[LucMoreau33560]

Hello,

I try to round the corner of my ConvexAppBar. To do that, I add a ClipRRect as parent. The corners are well rounded but the top of the central circle (style:TabStyle.fixedCircle) is cut.

Is it possible to round the corner of the nav bar properly ?

To reproduce :

Widget getBottomNavBar2() {
    return Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.only(
              topRight: Radius.circular(30), topLeft: Radius.circular(30)),
          boxShadow: [
            BoxShadow(color: Colors.black38, spreadRadius: 0, blurRadius: 10),
          ],
        ),
        child: ClipRRect(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(30.0),
              topRight: Radius.circular(30.0),
            ),
            child: ConvexAppBar(
              style: TabStyle.fixedCircle,
              backgroundColor: const Color(0xFFAC2529),

              items: [
                TabItem(
                  icon: Icons.search,
                ),
                TabItem(
                    icon: new ImageIcon(
                        new AssetImage("logo.png"))),
                TabItem(icon: Icons.settings),
              ],
              onTap: (int i) => print('click index=$i'),
            )));
  }

Regards,
Luc

[avenwu]

Add some screenshots please :)

[LucMoreau33560]

With ClipRRect, Fixed circle is cut, rounded border OK

[LucMoreau33560]

Without ClipRREct : Fixed circle is ok, but no rounded border

[LucMoreau33560]

What I want : Fixed circle not cut and rounded border ;-)

[avenwu]

What you need is quit reasonable. Use clipRect directly will cut the AppBar, we'll try to support it.

[avenwu]

@LucMoreau33560 We are going to ship a new version, which support the corner config. Try with this branch.

dependencies:
  convex_bottom_bar:
    git:
      url: https://github.com/hacktons/convex_bottom_bar.git
      ref: f-support-corner

cornerRadius: draw the background with topLeft and topRight corner; Only work work with fixed style |

[avenwu]

By the way you also need to upgrade flutter to v1.20