theme_provider 0.0.1+8 copy "theme_provider: ^0.0.1+8" to clipboard
theme_provider: ^0.0.1+8 copied to clipboard

outdated

Easy to use, customizable and pluggable Theme Provider. This Widget can be used to easily provide a theme controller across the widget tree.

theme_provider #

Codemagic build status Pub Package

Easy to use, customizable and pluggable Theme Provider. This is still a work in progress.

Basic Usage Basic Usage
Record Record

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 theme data:

 ThemeProvider.themeOf(context)
 // 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 #

  • Add next theme command
  • Add theme cycling widget
  • Add theme selection by theme id
  • Add theme select and preview widget
  • Persist current selected theme
  • Add unit tests and example
  • Remove provider dependency

Getting Started #

For help getting started with Flutter, view our online documentation.

For help on editing package code, view the documentation.

299
likes
0
pub points
95%
popularity

Publisher

unverified uploader

Easy to use, customizable and pluggable Theme Provider. This Widget can be used to easily provide a theme controller across the widget tree.

Homepage

License

unknown (LICENSE)

Dependencies

flutter

More

Packages that depend on theme_provider