Customizable and pluggable Theme Provider with Flutter 1

theme provider

easy to use, customizable and pluggable theme provider. this is still a work in progress.

basic usage	basic usage

include in your project

dependencies:
  theme_provider: ^0.0.1

run packages get and import it

import 'package:theme_provider/theme_provider.dart';

usage

wrap your material app like this:

class myapp extends statelesswidget {
  @override
  widget build(buildcontext context) {
    return themeprovider(
      builder: (context, theme) => materialapp(
        home: homepage(),
        theme: theme,
      ),
    );
  }
}

to change the theme:

 themeprovider.controllerof(context).nexttheme();

access current apptheme

 themeprovider.themeof(context)

access theme data:

 themeprovider.themeof(context).data
 // or
 theme.of(context)

passing additional options

this can also be used to pass additional data associated with the theme. use options to pass additional data that should be associated with the theme.
eg: if font color on a specific button changes create a class to encapsulate the value.

  class themeoptions{
    final color specificbuttoncolor;
    themeoptions(this.specificbuttoncolor);
  }

then provide the options with the theme.

class myapp extends statelesswidget {
@override
widget build(buildcontext context) {
  return themeprovider(
    themes: themes: [
        apptheme<themeoptions>(
            data: themedata.light(),
            options: themeoptions(colors.blue),
        ),
        apptheme<themeoptions>(
            data: themedata.dark(),
            options: themeoptions(colors.red),
        ),
      ],
      builder: (context, theme) => materialapp(
        home: homepage(),
        theme: theme,
      ),
  );
}
}

then the option can be retrieved as,

themeprovider.optionsof<themeoptions>(context).specificbuttoncolor

additonal widgets

theme cycle widget

iconbutton to be added to appbar to cycle to next theme.

scaffold(
  appbar: appbar(
    title: text("example app"),
    actions: [cyclethemeiconbutton()]
  ),
),

theme selecting dialog

simpledialog to let the user select the theme.

showdialog(context: context, builder: (_) => themedialog())

todo

• [x] add next theme command
• [x] add theme cycling widget
• [x] add theme selection by theme id
• [x] add theme select and preview widget
• [ ] persist current selected theme
• [x] add unit tests and example
• [x] remove provider dependency