Flutter Remove CupertinoNavigationBar Backdrop

Question

Is there a way to remove the blur of the CupertinoNavigationBar so it's truly transparent? I got rid of the border and color but there's a blur, for the android AppBar there isn't any blur but for the iOS AppBar it's just there. I check the code for it and there's an ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0) applied to it but how do I remove it?

Code:

CupertinoNavigationBar(
    backgroundColor: Colors.transparent,
    border: Border.all(
        color: Colors.transparent,
        width: 0.0,
        style: BorderStyle.none
    ),
    leading: IconButton(
    icon: Icon(
        Icons.close,
        color: Colors.red,
    ),
    onPressed: () {
        Navigator.pop(context);
    }),
    automaticallyImplyLeading: false,
    trailing: IconButton(
        icon: Icon(
            Icons.refresh,
            color: Colors.blue,
        ),
        onPressed: widget.onRestart
    ),
),

Beaudette

Answer 1

CupertinoNavigationBar has a border property. If you wish to remove the border, you can do something like this:

CupertinoNavigationBar(
   border: Border(bottom: BorderSide(color: Colors.transparent)),
));

Vernonvernor

Answer 2

There is no API at the moment to do this. You'd need open a GitHub issue to request this feature, or alternatively fork the Flutter lib and remove that code yourself. It seems like reasonable request, and it's probably just a constructor flag, so could be a relatively quick fix for the Flutter team to implement.

Arlon

Answer 3

CupertinoNavigationBar(
   border: Border(),
));

Accompaniment

Isn’t this what the top-voted answer already says, but with additional details and sample properties? – Mvd