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

MyMemoWiki

「Flutter Riverpod」の版間の差分

提供: MyMemoWiki
ナビゲーションに移動 検索に移動
57行目: 57行目:
  
 
===基本===
 
===基本===
 +
----
 +
[[FlutterFire]]
 
<pre>
 
<pre>
 
import 'package:flutter/material.dart';
 
import 'package:flutter/material.dart';

2021年8月12日 (木) 06:26時点における版

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

基本


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