theme_provider

易于使用、可自定义和可插拔的主题提供程序。这仍在开发中。

基本用法 基本用法
next select

包含在你的项目中

dependencies:
  theme_provider: ^0.0.1

运行 `packages get` 并导入它

import 'package:theme_provider/theme_provider.dart';

用法

像这样包裹你的 Material App

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ThemeProvider(
      builder: (context, theme) => MaterialApp(
        home: HomePage(),
        theme: theme,
      ),
    );
  }
}

更改主题

 ThemeProvider.controllerOf(context).nextTheme();

访问当前 `AppTheme`

 ThemeProvider.themeOf(context)

访问主题数据

 ThemeProvider.themeOf(context).data
 // or
 Theme.of(context)

传递附加选项

这也可以用来传递与主题相关的附加数据。使用 `options` 传递应与主题关联的附加数据。
例如:如果某个特定按钮的字体颜色发生变化,创建一个类来封装该值。

  class ThemeOptions{
    final Color specificButtonColor;
    ThemeOptions(this.specificButtonColor);
  }

然后与主题一起提供选项。

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,
      ),
  );
}
}

然后可以这样检索选项:

ThemeProvider.optionsOf<ThemeOptions>(context).specificButtonColor

附加小部件

主题循环小部件

添加到 `AppBar` 以循环到下一个主题的 `IconButton`。

Scaffold(
  appBar: AppBar(
    title: Text("Example App"),
    actions: [CycleThemeIconButton()]
  ),
),

主题选择对话框

让用户选择主题的 `SimpleDialog`。

showDialog(context: context, builder: (_) => ThemeDialog())

待办事项

  • [x] 添加下一个主题命令
  • [x] 添加主题循环小部件
  • [x] 添加通过主题 ID 选择主题
  • [x] 添加主题选择和预览小部件
  • [ ] 持久化当前选定的主题
  • [x] 添加单元测试和示例
  • [x] 移除 provider 依赖

GitHub

https://github.com/kdsuneraavinash/theme_provider