Transparent background behind ClipPath - flutter

Question

So, I'm pretty new to flutter, I'm trying to have a AppBar that looks like this :
And I'm actually able to do it using ClipPath like this :
class Header extends StatelessWidget {
final String page;
const Header({required this.page});
#override
Widget build(BuildContext context) {
final double topPadding = MediaQuery.of(context).padding.top;
return ClipPath(
child: HeaderContent(page: page, padding: topPadding),
clipper: Clipper(page: page));
}
}
class HeaderContent extends StatelessWidget {
final String page;
final double padding;
const HeaderContent({required this.page, required this.padding});
#override
Widget build(BuildContext context) {
final int headerHeight = page == "inscription" ? 250 : 150;
return Container(
height: headerHeight + padding,
padding: EdgeInsets.all(15),
width: double.infinity,
color: Theme.of(context).primaryColor,
child: AppBar(
title: Text("NOTIFICATIONS", style: Theme.of(context).textTheme.headline6),
centerTitle: true,
leading: Icon(
Icons.arrow_back,
size: 40,
),
),
);
}
}
class Clipper extends CustomClipper<Path> {
final String page;
const Clipper({required this.page});
#override
Path getClip(Size size) {
final Path path = Path();
selectHeaderClip(size, page, path);
return path;
}
#override
bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}
Where the selectHeaderClip is a custom function that return the appropriate clip for a given page.
However, when I have a scrollable page (list of notifications for example), I see the notifications hiding too early as if there was a white rectangular container underneath my appBar. So my question basically is: how can I make that container transparent ?
Ps: sorry for the bad formulation of the question, don't hesitate to edit.