BLOCのフラッター

flutter_bloc圏は、あなたが簡単にブロックモードに統合することができますサードパーティのライブラリで、ライブラリはRXDart、パターンを初めて目、右のブロックは組み合わせ

1、ウィジェットトリガイベントのイベント 

図2に示すように、ブロックは、イベントと、処理ロジックにイベントを受信します

図3に示すように、論理処理結果とに返します 

図4に示すように、UI表示データ

実際には、それはMVVMのようなビットは、イベントがちょうどイベントを開始し、値を渡すことができない、ブロックはロジックに対処するための具体的な方法を見つけるためにイベントに応じて、このイベントを受け取り、結果が返された後、我々は理解していない場合、私は例を与える、私は夕食のためにレストランに行きましたボスは皿料理の具体的な名前（シンク）を見つけるように言われた後、ポイントは料理人がソテースパイシーチキンを（これは論理的なプロセスである）作るのですか、上司によると、ボス磐を（これはイベントです）教えて（状態）料理の所有者が務めました（データ変更をUI）

flutter_blocはすぐ圏を構築することができ、これらのAPIに応じて、いくつかのAPIを提供します

   BlocBuilder    

   BlocProvider   

   BlocProviderTree  

   BlocListener  

   BlocListenerTree 

BlocBuilder

3つのプロパティ圏条件ビルダーがあります。

BlocBuilder（
圏は:, DART圏を追加
条件条件のために：（previousState、currentStateの）{ リターン trueには ;}、// trueにオプションのデフォルトの戻り
ビルダー：（BuildContextコンテキスト、国家リスト）状態} {データを返します
）。

BlocProvider

これは、グローバル変数を管理することができます

    BlocProvider（

    圏：、他のワード使用して、このDARTインターフェイスこのブロックのブロック転送を追加し

    、子供を：ログイン（）、サブクラス

    ）

BlocProvider.of <LogBloc>（文脈）によって子ウィジェット圏を取得

 それがこのモードになる場合は、プッシュを渡すことができます

    Navigator.push（文脈、新しいMaterialPageRoute（

    ビルダー：（コンテキスト） => BlocProvider（

    圏：LogBloc（）、

    子：HomePage1（）、 

    ）））;

BlocProviderTree

あなたは、複数の状態を管理することができます

状態の複数を使用することができ、ウィジェット管理に関し

BlocProviderTree（
  blocProviders [ 
    BlocProvider <ブロック> （単位：ロック（））
    BlocProvider <BlocB> （単位：BlocB（））
    BlocProvider <BlocC> （単位：BlocC（））
  ] 
  子供：子供（） 
）

デモ

インポート 'パッケージ：フラッター/ material.dart' ;
インポート 'パッケージ：flutter_app /ブロック/ counter_bloc_demo.dart' ; 


クラス BlocDemoは延びStatelessWidget { 
  @Override 
  ウィジェットビルド（BuildContextコンテキスト）{ 
    返すCounterProviderを（
      ブロック：CounterBloc（）、
      子：足場（
        アプリケーションバー：アプリケーションバー（
          タイトル：テキスト（ 'BlocDemo' ）、
          標高： 0.0 、
        ）、
        本体：CounterHome（ ）、
        floatingActionButton：CounterActionButton（） ）
    ）。
      
  } 
}

インポート「ダーツ：非同期」; 

インポート 'パッケージ：フラッター/ material.dart' ; 

クラス CounterHomeは延びStatelessWidget { 
  @Overrideの
  ウィジェットビルド（BuildContextコンテキスト）{ 
    CounterBloc _counterBloc = CounterProvider.of（コンテキスト）を.bloc。
    
    返すセンター（
      子：StreamBuilder（
        InitialDataは： 0は、
        ストリーム：_counterBloc.count、
        ビルダー：（文脈、スナップショット）{ 
          返すActionChip（
            テキスト（：ラベルを '$ {snapshot.data}' 、）
            onPressed：（）{ 
              //_counterBloc.log（）。
              _counterBloc.counter.add（1 ）。
            }、 
          ）。
        }、 
      ）、
    ）。 
  } 
} 

クラス CounterActionButtonは延びStatelessWidget { 
  @Override 
  ウィジェット構築（BuildContextコンテキスト）{ 
    CounterBloc _counterBloc = CounterProvider.of（コンテキスト）を.bloc。
    
    戻りFloatingActionButton（
      子：アイコン（Icons.add）を、
      onPressed：（）{ 
        // _counterBloc.log（）; 
        _counterBloc.counter.add（1 ）; 
      } 
    ）; 
  } 
}

クラス CounterProviderは延びInheritedWidget {
   最終ウィジェット子と、
  最終CounterBloc圏。

  CounterProvider（{ 
    この.child、
     この.bloc、
  }）：スーパー（子：子）。

  静的（BuildContextコンテキスト）=>のCounterProvider 
      context.inheritFromWidgetOfExactType（CounterProvider）。

  @Override 
  BOOL updateShouldNotify（CounterProvider oldWidget）{ 
    戻り 真。
  } 
} 

クラスCounterBloc {
   INT _count = 0 。
  
  最後の_counterActionController = StreamController < 整数 > （）; 
  StreamSink < 整数 >カウンタを取得=> _counterActionController.sink。

  最終 _counterController = StreamController < 整数 > （）; 
  ストリーム < 整数 > GETカウント=> _counterController.stream。

  CounterBloc（）{ 
    _counterActionController.stream.listen（onDataハンドラ）。
  } 

  ボイド onDataハンドラ（int型データ）{ 
    印刷（ '$データ' ）。
    _count =データ+ _count。
    _counterController.add（_count）。
  }

  ボイドdisponse（）{ 
    _counterActionController.close（）。
    _counterController.close（）。
  } 
  
  ボイドログ（）{ 
    プリント（ 'ブロック' ）。
  } 
}