Remove SliverAppBar bottom border - Flutter

Question

I wanna remove the border that I highlighted in the above picture. I couldn't find any solution to fix this :(

here is my SliverAppBar Code :

NestedScrollView(
        headerSliverBuilder: (BuildContext ctx, isScrolled) {
            return <Widget>[
               SliverAppBar(
                  title: Text('Applying to this job opportunity'),
                  pinned: true,
                  titleSpacing: 0,
                  floating: true,
                  expandedHeight: 180,
                  flexibleSpace: //some widgets
             )
        ]
    }
)

Answer 1

Just set the elevation property to 0.

 SliverAppBar(
                  title: Text('Applying to this job opportunity'),
                  pinned: true,
                  elevation: 0,
                  titleSpacing: 0,
                  floating: true,
                  expandedHeight: 180,
                  flexibleSpace: //some widgets
             )

More info : https://api.flutter.dev/flutter/material/SliverAppBar/elevation.html

Answer 2

It is a long lasting and annoying issue for flutter for ages if you have two slivers are in same color.

The current best walkaround is here (https://github.com/flutter/flutter/issues/37578#issuecomment-640302364) by adding a shadow box around your slivers.

You have to try which sliver is best to add the box shadow and how the shadow is added.

Mine is in this way such that it fills the line both on top and at the bottom of the sliver.

boxShadow: [
  BoxShadow(
    color: myColor,
    blurRadius: 0.0,
    spreadRadius: 1.0,
    offset: Offset(0, 0),
   ),
],