How to change status bar color in Flutter?

To change the color of the status bar in Flutter, you can use the SystemChrome class from the flutter:flutter package. You can use the setSystemUIOverlayStyle method to set the style of the status bar. This method takes a SystemUiOverlayStyle object as an argument, which has properties for the status bar color, icon brightness, and so on.

Here’s an example of how you can change the status bar color to a light blue color:

import 'package:flutter/services.dart';

void main() {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.lightBlue,
    statusBarBrightness: Brightness.light,
  ));
  runApp(MyApp());
}

Note that this will change the status bar color for the entire app. If you want to change the status bar color only for a specific screen or route, you can wrap the widget tree for that screen or route in a AnnotatedRegion widget, and set the SystemUiOverlayStyle value in the value property.

Here’s an example of how to change the status bar color only for a specific screen:

import 'package:flutter/services.dart';

class MyScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: Colors.lightBlue,
        statusBarBrightness: Brightness.light,
      ),
      child: Scaffold(
        // your screen content
      ),
    );
  }
}