| ページ一覧 | ブログ | twitter |  書式 | 書式(表) |

MyMemoWiki

Flutter Riverpod

提供: MyMemoWiki
2021年10月30日 (土) 01:25時点におけるPiroto (トーク | 投稿記録)による版 (→‎基本)
ナビゲーションに移動 検索に移動

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に依存しない形でデータを受け取れる

基本


FlutterFire

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