in Color

A package can help you to change your flutter app’s statusbar’s color

1.9k Views

flutter status bar color

How to change your flutter app’s status bar’s color or navigation bar’s color programmatically?
Here are a package that provides you with the method available to change your flutter app’s status bar’s color or navigation bar’s color programmatically.

Getting Started

Installation

Add this to your pubspec.yaml (or create it):

dependencies:
  flutter_statusbarcolor: any

Then run the flutter tooling:

flutter packages get

Example

// change the status bar color to material color [green-400]
await FlutterStatusbarcolor.setStatusBarColor(Colors.green[400]);
if (useWhiteForeground(Colors.green[400])) {
  FlutterStatusbarcolor.setStatusBarWhiteForeground(true);
} else {
  FlutterStatusbarcolor.setStatusBarWhiteForeground(false);
}

// change the navigation bar color to material color [orange-200]
await FlutterStatusbarcolor.setNavigationBarColor(Colors.orange[200]);
if (useWhiteForeground(Colors.orange[200]) {
  FlutterStatusbarcolor.setNavigationBarWhiteForeground(true);
} else {
  FlutterStatusbarcolor.setNavigationBarWhiteForeground(false);
}

// get statusbar color and navigationbar color
Color statusbarColor = await FlutterStatusbarcolor.getStatusBarColor();
Color navigationbarColor = await FlutterStatusbarcolor.getNavigationBarColor();
flutter_statusbarcolor

Details in example/ folder.

Api level minimum requirement

  • android
    • getStatusBarColor (5.0)
    • setStatusBarColor (5.0)
    • setStatusBarWhiteForeground (6.0)
    • getNavigationBarColor (5.0)
    • setNavigationBarColor (5.0)
    • setNavigationBarWhiteForeground (8.0)
  • ios
    • getStatusBarColor (7+)
    • setStatusBarColor (7+)
    • setStatusBarWhiteForeground (7+)

Note that

  • If you find the foreground brightness reverted after changing the app lifecycle,
    please use flutter’s WidgetsBindingObserver mixin.
  • If IOS build does not work, please send issues or pull requests.

GitHub

https://github.com/mchome/flutter_statusbarcolor

Written by James

An Android and iOS game about colors made using Flutter

Flutter Material Color Picker