Flutter - Rounded corners in SliverAppBar

Question

In Flutter you can have custom shape in AppBar widget with shape property, but this property is missing in SliverAppBar widget

  AppBar(
    title: Text('Hello'),
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.vertical(
        bottom: Radius.circular(30),
      ),
    ),
  ),

how to have rounded corners in SliverAppBar?

Answer 1

This is the right and easy way to change the shape of a SliverAppBar (As mentioned in Flutter docs). No need you use any tricks. Even you can shape it as any shape you want.

SliverAppBar(
  shape: ContinuousRectangleBorder(
      borderRadius: BorderRadius.only(
          bottomLeft: Radius.circular(30), bottomRight: Radius.circular(30))),
  title: Text('Sliver AppBar'),
);