flutter_statusbarcolor 0.2.3

  • Readme
  • Changelog
  • Example
  • Installing
  • 99

flutter_statusbarcolor #

pub package

A package can help you to change your flutter app's statusbar's color or navigationbar's color programmatically.

Getting Started #

// 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();

preview

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.

Changelog #

[0.2.3] #

  • Fix iOS 13+ Dark mode.

[0.2.2] #

  • Fix iOS 13 build error.

[0.2.1] #

  • Null check for android activity.

[0.2.0] #

  • Breaking change. Updated Gradle tooling, kotlin version and compileSdkVersion. Same as 0.1.5.

[0.1.6] #

  • Revert to 0.1.4.

[0.1.5] #

  • Android dependencies version upgrade for AndroidX support.

[0.1.4+1] #

  • Update docs.

[0.1.4] #

  • Allow to animate the color after setting the color of statusbar or navigationbar.

[0.1.3] #

  • Fix ios build.

[0.1.2] #

  • Add getStatusBarColor and getNavigationBarColor.

[0.1.1] #

  • Fix ios build.

[0.1.0] #

  • Add setStatusBarWhiteForeground to set statusbar content color.
  • Add setNavigationBarWhiteForeground to set navigationbar content color.
  • Add useWhiteForeground to know the background is fit with white content.

[0.0.4] #

  • Upgrade to dart2.

[0.0.3] #

  • Try to fix ios build again.

[0.0.2] #

  • Try to fix ios build.

[0.0.1+1] #

  • Format code.

[0.0.1] #

  • Initial release.

example/lib/main.dart

import 'dart:math';

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

main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
  Color _randomStatusColor = Colors.black;
  Color _randomNavigationColor = Colors.black;

  bool _useWhiteStatusBarForeground;
  bool _useWhiteNavigationBarForeground;

  @override
  initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  @override
  didChangeAppLifecycleState(AppLifecycleState state) {
    if (state == AppLifecycleState.resumed) {
      if (_useWhiteStatusBarForeground != null)
        FlutterStatusbarcolor.setStatusBarWhiteForeground(
            _useWhiteStatusBarForeground);
      if (_useWhiteNavigationBarForeground != null)
        FlutterStatusbarcolor.setNavigationBarWhiteForeground(
            _useWhiteNavigationBarForeground);
    }
    super.didChangeAppLifecycleState(state);
  }

  changeStatusColor(Color color) async {
    try {
      await FlutterStatusbarcolor.setStatusBarColor(color, animate: true);
      if (useWhiteForeground(color)) {
        FlutterStatusbarcolor.setStatusBarWhiteForeground(true);
        FlutterStatusbarcolor.setNavigationBarWhiteForeground(true);
        _useWhiteStatusBarForeground = true;
        _useWhiteNavigationBarForeground = true;
      } else {
        FlutterStatusbarcolor.setStatusBarWhiteForeground(false);
        FlutterStatusbarcolor.setNavigationBarWhiteForeground(false);
        _useWhiteStatusBarForeground = false;
        _useWhiteNavigationBarForeground = false;
      }
    } on PlatformException catch (e) {
      debugPrint(e.toString());
    }
  }

  changeNavigationColor(Color color) async {
    try {
      await FlutterStatusbarcolor.setNavigationBarColor(color, animate: true);
    } on PlatformException catch (e) {
      debugPrint(e.toString());
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 2,
        child: Scaffold(
          appBar: AppBar(
            title: Text('Flutter statusbar color plugin example'),
            bottom: TabBar(
              tabs: <Widget>[
                Tab(text: 'Statusbar'),
                Tab(text: 'Navigationbar(android only)')
              ],
            ),
          ),
          body: TabBarView(
            children: <Widget>[
              Column(
                mainAxisSize: MainAxisSize.max,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Builder(builder: (BuildContext context) {
                    return FlatButton(
                      onPressed: () => FlutterStatusbarcolor.getStatusBarColor()
                          .then((Color color) {
                        Scaffold.of(context).showSnackBar(SnackBar(
                          content: Text(color.toString()),
                          backgroundColor: color,
                          duration: const Duration(milliseconds: 200),
                        ));
                      }),
                      child: Text(
                        'Show Statusbar Color',
                        style: TextStyle(color: Colors.white),
                      ),
                      color: Colors.black,
                    );
                  }),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () => changeStatusColor(Colors.transparent),
                    child: Text('Transparent'),
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () {
                      Color color = Colors.amberAccent;
                      changeStatusColor(color);
                    },
                    child: Text('amber-accent'),
                    color: Colors.amberAccent,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () => changeStatusColor(Colors.tealAccent),
                    child: Text('teal-accent'),
                    color: Colors.tealAccent,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () =>
                        FlutterStatusbarcolor.setStatusBarWhiteForeground(true)
                            .then((_) => _useWhiteStatusBarForeground = true),
                    child: Text(
                      'light foreground',
                      style: TextStyle(color: Colors.white),
                    ),
                    color: Colors.black,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () =>
                        FlutterStatusbarcolor.setStatusBarWhiteForeground(false)
                            .then((_) => _useWhiteStatusBarForeground = false),
                    child: Text('dark foreground'),
                    color: Colors.white,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () {
                      Random rnd = Random();
                      Color color = Color.fromARGB(
                        255,
                        rnd.nextInt(255),
                        rnd.nextInt(255),
                        rnd.nextInt(255),
                      );
                      changeStatusColor(color);
                      setState(() => _randomStatusColor = color);
                    },
                    child: Text(
                      'Random color',
                      style: TextStyle(
                        color: useWhiteForeground(_randomStatusColor)
                            ? Colors.white
                            : Colors.black,
                      ),
                    ),
                    color: _randomStatusColor,
                  ),
                ],
              ),
              Column(
                mainAxisSize: MainAxisSize.max,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Builder(builder: (BuildContext context) {
                    return FlatButton(
                      onPressed: () =>
                          FlutterStatusbarcolor.getNavigationBarColor()
                              .then((Color color) {
                        Scaffold.of(context).showSnackBar(SnackBar(
                          content: Text(color.toString()),
                          backgroundColor: color,
                          duration: const Duration(milliseconds: 200),
                        ));
                      }),
                      child: Text(
                        'Show Navigationbar Color',
                        style: TextStyle(color: Colors.white),
                      ),
                      color: Colors.black,
                    );
                  }),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () => changeNavigationColor(Colors.green[400]),
                    child: Text('Green-400'),
                    color: Colors.green[400],
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () =>
                        changeNavigationColor(Colors.lightBlue[100]),
                    child: Text('LightBlue-100'),
                    color: Colors.lightBlue[100],
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () =>
                        changeNavigationColor(Colors.cyanAccent[200]),
                    child: Text('CyanAccent-200'),
                    color: Colors.cyanAccent[200],
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () => FlutterStatusbarcolor
                            .setNavigationBarWhiteForeground(true)
                        .then((_) => _useWhiteNavigationBarForeground = true),
                    child: Text(
                      'light foreground',
                      style: TextStyle(color: Colors.white),
                    ),
                    color: Colors.black,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () => FlutterStatusbarcolor
                            .setNavigationBarWhiteForeground(false)
                        .then((_) => _useWhiteNavigationBarForeground = false),
                    child: Text('dark foreground'),
                    color: Colors.white,
                  ),
                  Padding(padding: const EdgeInsets.all(10.0)),
                  FlatButton(
                    onPressed: () {
                      Random rnd = Random();
                      Color color = Color.fromARGB(
                        255,
                        rnd.nextInt(255),
                        rnd.nextInt(255),
                        rnd.nextInt(255),
                      );
                      setState(() => _randomNavigationColor = color);
                      changeNavigationColor(color);
                    },
                    child: Text(
                      'Random color',
                      style: TextStyle(
                        color: useWhiteForeground(_randomNavigationColor)
                            ? Colors.white
                            : Colors.black,
                      ),
                    ),
                    color: _randomNavigationColor,
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_statusbarcolor: ^0.2.3

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_statusbarcolor/flutter_statusbarcolor.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
97
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
99
Learn more about scoring.

We analyzed this package on Jul 12, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.8.4
  • pana: 0.13.14
  • Flutter: 1.17.5

Analysis suggestions

Package does not support Flutter platform linux

Because:

  • package:flutter_statusbarcolor/flutter_statusbarcolor.dart that declares support for platforms: android, ios

Package does not support Flutter platform macos

Because:

  • package:flutter_statusbarcolor/flutter_statusbarcolor.dart that declares support for platforms: android, ios

Package does not support Flutter platform web

Because:

  • package:flutter_statusbarcolor/flutter_statusbarcolor.dart that declares support for platforms: android, ios

Package does not support Flutter platform windows

Because:

  • package:flutter_statusbarcolor/flutter_statusbarcolor.dart that declares support for platforms: android, ios

Package not compatible with SDK dart

Because:

  • flutter_statusbarcolor that is a package requiring null.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.28.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.12 1.14.13
meta 1.1.8 1.2.2
sky_engine 0.0.99
typed_data 1.1.6 1.2.0
vector_math 2.0.8 2.1.0-nullsafety