How to change the status bar text color on Ios

For IOS and Android:

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark.copyWith(
   statusBarColor: Colors.white, // Color for Android
   statusBarBrightness: Brightness.dark // Dark == white status bar -- for IOS.
));

When I don't use AppBar, the colour can be changed using AnnotatedRegion.

import 'package:flutter/services.dart';

...    

Widget build(BuildContext context) {
   return Scaffold(
      body: AnnotatedRegion<SystemUiOverlayStyle>(
         value: SystemUiOverlayStyle.light,                
         child: ...,
      ),
   );
}

AnnotatedRegion helps you change status bar text color on iOS.

import 'package:flutter/services.dart';
...    

Widget build(BuildContext context) {
   return AnnotatedRegion<SystemUiOverlayStyle>(
         value: SystemUiOverlayStyle.dark,                
         child: ...,
   );
}

But if you have AppBar in Scaffold then only AnnotatedRegion won't work. Here is solution.

  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.dark, // play with this
      child: Scaffold(
        appBar: AppBar(
          brightness: Brightness.light, // play with this
        ),
        body: Container(),
     );
  }

@Antoine Basically you can set your theme Brightness, or you can manually override the appbar brightness using the following :

appBar: new AppBar(
  title: new Text(widget.title),
  brightness: Brightness.light, // or use Brightness.dark
),

Do note that this will only switch between white and black status text color.

.dark will make the status bar text WHITE, while .light will make the status bar text BLACK.

Maybe for a more custom color, like the comment said you can view SystemChrome class.

Tags:

Flutter