「Flutter Riverpod」の版間の差分
ナビゲーションに移動
検索に移動
55行目: | 55行目: | ||
|- | |- | ||
|} | |} | ||
+ | |||
+ | ===基本=== | ||
+ | <pre> | ||
+ | import 'package:flutter/material.dart'; | ||
+ | import 'package:firebase_core/firebase_core.dart'; | ||
+ | import 'package:flutter_riverpod/flutter_riverpod.dart'; | ||
+ | |||
+ | void main() async { | ||
+ | // Flutter の初期化処理を待つ | ||
+ | WidgetsFlutterBinding.ensureInitialized(); | ||
+ | // Firebaseの初期化(非同期)を待つ | ||
+ | await Firebase.initializeApp(); | ||
+ | |||
+ | // ProviderScope でラップ | ||
+ | runApp(ProviderScope(child: MyApp())); | ||
+ | } | ||
+ | |||
+ | class MyApp extends StatelessWidget { | ||
+ | // This widget is the root of your application. | ||
+ | @override | ||
+ | Widget build(BuildContext context) { | ||
+ | return MaterialApp( | ||
+ | title: 'MyApp', | ||
+ | theme: ThemeData( | ||
+ | primarySwatch: Colors.blue, | ||
+ | ), | ||
+ | home: Consumer( // Comsumeerでラップ | ||
+ | builder: (context, watch, child) { | ||
+ | return Center(child:Text('MyApp')); | ||
+ | }, | ||
+ | ) | ||
+ | ); | ||
+ | } | ||
+ | } | ||
+ | </pre> |
2021年8月12日 (木) 06:25時点における版
| Flutter | Dart | ブログカテゴリ(Flutter) | Android Studio | Flutter macos | FlutterFire | Flutter 手順 |
Flutter Riverpod
基本
データの受け渡し
Providerをグローバルに定義し、データを受け渡す
データを渡す
種類 | 目的 |
---|---|
Provider | 任意のデータを渡す |
FutureProvider | Futureから取得する任意のデータを渡す |
Stream Provider | Streamから取得する任意のデータを渡す |
StateProvider | 変更可能な任意のデータを渡す |
StateNotifireProvider | StateNotifireProviderから取得する任意のデータを渡す |
ScopedProvider | 場所に応じて異なる任意のデータを渡す |
データを受け取る
種類 | 目的 |
---|---|
ConsumerWidget | 継承することでデータを受け取れるWidget |
Consumer | コールバック内でデータを受け取れるWidget |
useProvider() | flutter_hooksを利用し、HookWidgetを継承したWidgetでデータを受け取れる関数 |
context.read() | BuildContextからデータを受け取れる関数(ただしデータの変更通知は受け取れない) |
ProviderContainer | Flutterに依存しない形でデータを受け取れる |
基本
import 'package:flutter/material.dart'; import 'package:firebase_core/firebase_core.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; void main() async { // Flutter の初期化処理を待つ WidgetsFlutterBinding.ensureInitialized(); // Firebaseの初期化(非同期)を待つ await Firebase.initializeApp(); // ProviderScope でラップ runApp(ProviderScope(child: MyApp())); } class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'MyApp', theme: ThemeData( primarySwatch: Colors.blue, ), home: Consumer( // Comsumeerでラップ builder: (context, watch, child) { return Center(child:Text('MyApp')); }, ) ); } }
© 2006 矢木浩人