2

How to change status bar color whithout AppBar ?

my snippet code :

 @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: AnnotatedRegion<SystemUiOverlayStyle>(
        value: SystemUiOverlayStyle.light,
        child: BodyWidget(),
      ),//
    );
  }
Esmaeil Ahmadipour
  • 840
  • 1
  • 11
  • 32
Ndiaga GUEYE
  • 191
  • 3
  • 7

3 Answers3

9

Hope this will help you

void main() {
  SystemChrome.setSystemUIOverlayStyle(
    const SystemUiOverlayStyle(
      statusBarColor: Colors.red,
    ),
  );
  runApp(MyApp());
}
Nazmul Hasan
  • 175
  • 2
  • 12
6

this work for me

@override 
Widget build(BuildContext context) {
return Scaffold(
  body: AnnotatedRegion<SystemUiOverlayStyle>(
    value: SystemUiOverlayStyle.light,
    child: BodyWidget(),
  ),
);
}
Jared Burrows
  • 54,294
  • 25
  • 151
  • 185
Ndiaga GUEYE
  • 191
  • 3
  • 7
0

Another effective way this can be done:

class MyWidget extends StatelessWidget {
  const MyWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: Colors.red,
        systemNavigationBarColor: Colors.red,
        statusBarIconBrightness: Brightness.dark,
        systemNavigationBarIconBrightness: Brightness.dark,
      ),
      child: Scaffold(),
    );
  }
}
Tim
  • 152
  • 8