Flutter資料分離思想-BLoC

嚴格來說，BLoC（Business Logic Component）不是一個技術知識點，而是一種業務與介面分離的思想，類似於MVC MVP等。

實現思想

• 定義一個BloC類，內部定義業務資料，使用StreamController,對外暴露stream和sink。
• 利用StreamBuilder包裹真正使用資料的widget，builder會持續返回更新資料。

簡單示例

import 'dart:async';

import 'package:flutter/material.dart';

class BlocTest extends StatefulWidget {
  @override
  _BlocTestState createState() => _BlocTestState();
}

class _BlocTestState extends State<BlocTest> {
  PageTestBloc ptb = PageTestBloc();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("BLoC"),
        centerTitle: true,
      ),
      body: Center(
        child: StreamBuilder(
          stream: ptb.stream,
          builder: (context,AsyncSnapshot<int> snapshot){
            return Text(snapshot.data.toString());
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: (){
          ptb.add();
        },
      ),
    );
  }
}

class PageTestBloc {
  int _count = 0;
  StreamController<int> _controller = StreamController<int>();
  StreamSink<int> get _sink => _controller.sink;
  Stream<int> get stream => _controller.stream;

  void dispose(){
    _controller.close();
  }
  void add(){
    _count++;
    _sink.add(_count);
  }
}
複製程式碼