screentheme 0.0.2

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 91

Flutter Screen Theme plugin

This plugin for Flutter adds the ability to change the status bar theme: light or dark (Android and iOS). It also provides the ability to change the navigation bar theme and color (Android only)

Demo App

Getting Started

On iOS only, please add in your Info.plist:

<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

Then you just have to import the package in your dart files with

import 'package:screentheme/screentheme.dart';

For each call, you can specify which platform you want to target (by default both):

ScreenTheme.darkStatusBar(platform: Platform.Android);

Each call returns a boolean, which is true when the platform and the OS version support the feature. For the navigation bar, all calls will throw a MissingPluginException.

Status bar

Compatibility: Android (6.0+) & iOS

On Android, it will only work with Android 6.0 (Marshmallow) and above devices.

Compatibility: Android only

Android 5.0 (Lollipop) and above: color

Android 8.0 (Oreo) and above: theme (dark/light)

[0.0.2] - 21th March 2018.

  • Fix a bug when using Dart 2.

[0.0.1] - 18th March 2018.

  • Initial Release.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:screentheme/screentheme.dart';

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

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

class _MyAppState extends State<MyApp> {
  bool _lightStatusBar = false;
  bool _lightNavigationBar = false;

  @override
  initState() {
    super.initState();
    _init();
  }

  _init() async {
    await _initStatusBar();
    await _initNavigationBar();
  }

  _initStatusBar() async {
    bool lightStatusBar;
    try {
      lightStatusBar = await ScreenTheme.hasALightStatusBar();
    } on Exception {
      lightStatusBar = false;
    }

    setState(() {
      _lightStatusBar = lightStatusBar;
    });
  }

  _initNavigationBar() async {
    bool lightNavigationBar;
    try {
      lightNavigationBar = await ScreenTheme.hasALightNavigationBar();
    } on Exception {
      lightNavigationBar = false;
    }

    setState(() {
      _lightNavigationBar = lightNavigationBar;
    });
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('Screen theme plugin example'),
        ),
        body: new Center(
          child: new Column(
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              new Expanded(
                child: new Column(
                  mainAxisSize: MainAxisSize.max,
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    new Padding(
                      padding: const EdgeInsets.only(bottom: 20.0),
                      child: new Text("Light status bar: $_lightStatusBar"),
                    ),
                    new RaisedButton(
                        onPressed: () {
                          enableLightStatusBar();
                        },
                        child: new Text("Light theme")),
                    new RaisedButton(
                      onPressed: () {
                        enableDarkStatusBar();
                      },
                      child: new Text("Dark theme"),
                    )
                  ],
                ),
              ),
              new Expanded(
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    new Padding(
                      padding: const EdgeInsets.only(bottom: 20.0),
                      child: new Text(
                          "Light navigation bar: $_lightNavigationBar"),
                    ),
                    new RaisedButton(
                        onPressed: () {
                          enableLightNavigationBar();
                        },
                        child: new Text("Light theme")),
                    new RaisedButton(
                      onPressed: () {
                        enableDarkNavigationBar();
                      },
                      child: new Text("Dark theme"),
                    ),
                    new RaisedButton(
                      onPressed: () {
                        changeNavigationBarColor();
                      },
                      child: new Text("Red color"),
                    )
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  changeNavigationBarColor() async {
    await ScreenTheme.updateNavigationBarColor(Colors.red);
  }

  enableLightStatusBar() async {
    await ScreenTheme.lightStatusBar();
    bool hasLightStatusBar = await ScreenTheme.hasALightStatusBar();

    setState(() {
      _lightStatusBar = hasLightStatusBar;
    });
  }

  enableDarkStatusBar() async {
    await ScreenTheme.darkStatusBar();
    bool hasLightStatusBar = await ScreenTheme.hasALightStatusBar();

    setState(() {
      _lightStatusBar = hasLightStatusBar;
    });
  }

  enableLightNavigationBar() async {
    await ScreenTheme.lightNavigationBar();
    bool hasLightNavigationBar = await ScreenTheme.hasALightNavigationBar();

    setState(() {
      _lightNavigationBar = hasLightNavigationBar;
    });
  }

  enableDarkNavigationBar() async {
    await ScreenTheme.darkNavigationBar();
    bool hasLightNavigationBar = await ScreenTheme.hasALightNavigationBar();

    setState(() {
      _lightNavigationBar = hasLightNavigationBar;
    });
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  screentheme: ^0.0.2

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

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

3. Import it

Now in your Dart code, you can use:


import 'package:screentheme/screentheme.dart';
  
Version Uploaded Documentation Archive
0.0.2 Mar 21, 2018 Go to the documentation of screentheme 0.0.2 Download screentheme 0.0.2 archive
0.0.1 Mar 18, 2018 Go to the documentation of screentheme 0.0.1 Download screentheme 0.0.1 archive
Popularity:
Describes how popular the package is relative to other packages. [more]
85
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
90
Overall:
Weighted score of the above. [more]
91
Learn more about scoring.

We analyzed this package on Oct 10, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0
  • pana: 0.12.4
  • Flutter: 0.9.5

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health suggestions

Format lib/screentheme.dart.

Run flutter format to format lib/screentheme.dart.

Maintenance suggestions

Package is pre-v0.1 release. (-10 points)

While there is nothing inherently wrong with versions of 0.0.*, it usually means that the author is still experimenting with the general direction of the API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=1.19.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11
meta 1.1.6
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8