CODEWITHSUNDEEP
flutterflutter-theme
Jitan Gupta
Jitan Gupta

Reputation: 484

How to set status bar color if using sliver app bar

As I am having sliver app bar in my screen, I am not using AppBar() widget. So by default the status bar color is white.

Is there a way to change the color of status bar from sliver.

enter image description here

Below code works for Android as expected, but not for iOS.

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: kPrimaryColor,
  ));

If using app bar to change the color, then sliver breaks enter image description here

Upvotes: 4

Views: 4390

Answers (3)

ashish poudyal
ashish poudyal

Reputation: 31

Add systemOverlayStyle to sliver app bar

SliverAppBar( systemOverlayStyle:const SystemUiOverlayStyle( statusBarColor: Colors.transparent, ), ),

Upvotes: 3

Osama Remlawi
Osama Remlawi

Reputation: 2990

Try this:

Scaffold(
    body: SafeArea(
      top: false,
      bottom: false,
      child: Container(), // Replace this container with your UI widget
    ),
)

Upvotes: 4

novol
novol

Reputation: 852

add color what you need and set pinned to false

SliverAppBar(
      backgroundColor: Colors.blue,
      expandedHeight: 160.0,
      pinned: false,
      stretch: false,
)

Upvotes: 2

Related Questions