Flutter 製アプリではもうこれ無しでは開発できないのでは?というほど、重要なポジションになった感のある Provider。
記念すべき第一回目はこの Provider1 について、具体的な利用方法になどを紹介したいと思います。
さっそくですが、Timerus での具体的な使い方は以下の通りとなっていて、二つの MultiProvider をネストした形となっています。
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
FutureProvider<Settings>(create: (_) => Settings().load()),
FutureProvider<Timerusies>(create: (_) => Timerusies().load()),
],
child: BUilder(
builder: (context) {
Settings settings = Provider.of<Settings>(context);
Timerusies timerusies = Provider.of<Timerusies>(context);
return MultiProvider(
providers: [
ChangeNotifierProvider.value(value: settings),
ChangeNotifierProvider.value(value: timerusies),
],
child: Builder(
builder: (context) {
Settings settings = Provider.of<Settings>(context);
Timerusies timerusies = Provider.of<Timerusies>(context);
if (timerusies == null || settings == null) {
return Center(child: CircularProgressIndicator());
}
return Scaffold(
...
);
},
),
);
}
),
);
};
}
各種設定を管理する Settings とタイマーデータを管理する Timerusies は SharedPreferences へデータを保存するようになっており、そちらは下記のような作りになってます。
class Settings extends ChangeNotifier {
String id;
...
Settings() {
...
};
Future<Settings> load() async {
return ...;
}
Future<bool> save() async {
...
notifyListeners();
}
}
見ての通りですが、Future を返す load()
と ChangeNotifier を発行する save()
が実装されてます。
先程の二つの MultiProvider は、 load()
によるデータの読み出しと save()
によるデータ変更の反映をそれぞれ担当するような形です。
こうしておくことで、好きな場所で Provider.of(context)
でデータを利用でき、好きな場所で save()
して変更データをすべての場所に反映させることができるようになります。
いやー、便利ですね。こんな便利な Provider ですが、今後ももっと便利になっていきそうな感じです。
Flutter というか dart の新機能である Extension 機能を取り入れた context.read()
等の機能、今は child: Builder()
と書かなければいけないところを直接 builder: (contedxt)
と書けるようになりそうなど、ますます進化していきそう2 です。
今後の進化も楽しみです。