Flutter: Transparent clipped AppBar

Question

I have a waved app bar that looks like this:

As you can see the clipped area is not transparent but rather has the (black) canvas color and is blocking some ListView entries.

The code for the app bar looks something like this:

class MainAppBar extends StatelessWidget implements PreferredSizeWidget {
...
@override
Widget build(BuildContext context) {
    return PreferredSize(
        child: ClipPath(
          clipper: WaveClip(),
          child: Container(
            color: getAppBarColor(),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                ...
              ],
            ),
          ),
        ),
        preferredSize: const Size.fromHeight(kToolbarHeight + 60));
  }
}

As one can see I am using a ClipPath with a custom clipper to clip a Container. How do I clip it in a transparent manner?

Answer 1

try this:

Scaffold(
  extendBodyBehindAppBar: true,

this will make items behind appbar visible