【问题标题】:How to transform flutter BLoC stream snapshot into custom object?如何将颤动的 BLoC 流快照转换为自定义对象?
【发布时间】:2019-09-19 14:37:13
【问题描述】:

我正在尝试在我的颤振应用中实现 BLoC 模式, 基本上这个应用程序计算一些结果并将其显示在表格中。 我创建了CalculationResultProviderCalculationResultBloc 如下

class CalculationResultProvider 
{   
List<EstimationResult> resultList = new List();

  List<EstimationResult> calculateResult(){
    return getInitialData();   }

  List<EstimationResult> getInitialData(){
        var cement = new EstimationResult();
        cement.material = "Cement";
        cement.unit = "Ton";
        cement.qty = 10;

        var sand = new EstimationResult();
        sand.material = "Sand";
        sand.unit = "Ton";
        sand.qty = 12;

        var gravel = new EstimationResult();
        gravel.material = "Gravel";
        gravel.unit = "Ton";
        gravel.qty = 5;

        var steel = new EstimationResult();
        steel.material = "Steel";
        steel.unit = "Ton";
        steel.qty = 5;

        List<EstimationResult> resultList = new List();
        resultList.add(cement);
        resultList.add(sand);
        resultList.add(gravel);
        resultList.add(steel);

        return resultList;    }  }

和我的 BLoC 提供者类如下

class CalculationResultBloc {
  final resultController = StreamController(); // create a StreamController
  final CalculationResultProvider provider =
      CalculationResultProvider(); // create an instance of our CounterProvider

  Stream get getReult =>
      resultController.stream; // create a getter for our stream

  void updateResult() {
    provider
        .calculateResult(); // call the method to increase our count in the provider
    resultController.sink.add(provider.resultList); // add the count to our sink
  }

  void dispose() {
    resultController.close(); // close our StreamController
  }
}

那么我需要在表格小部件中显示这些数据

class ResultTableWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => ResultTableWidgetState();
}

class ResultTableWidgetState extends State {
  final bloc =
      CalculationResultBloc(); // create an instance of the counter bloc

  @override
  Widget build(BuildContext context) {
    return StreamBuilder(
        stream: bloc.getReult,
        initialData: CalculationResultProvider().getInitialData(),
        builder: (context, snapshot) {
          DataTable(
            columns: [
              DataColumn(label: Text('Patch')),
              DataColumn(label: Text('Version')),
              DataColumn(label: Text('Ready')),
            ],
            rows:
                '${snapshot.data}' // Loops through dataColumnText, each iteration assigning the value to element
                    .map(
                      ((element) => DataRow(
                            cells: <DataCell>[
                              DataCell(Text(element[
                                  "Name"])), //Extracting from Map element the value
                              DataCell(Text(element["Number"])),
                              DataCell(Text(element["State"])),
                            ],
                          )),
                    )
                    .toList(),
          );
        });
  }

  @override
  void dispose() {
    bloc.dispose();
    super.dispose();
  }
}

要迭代返回表,它应该是List&lt;EstimationResult&gt;

但是如何将快照转换为List&lt;EstimationResult&gt;

在 bloc 类或小部件类中进行转换的最佳位置在哪里?

我是 dart 和 flutter 新手,谁能回答我的问题?

谢谢。

【问题讨论】:

    标签: dart flutter bloc


    【解决方案1】:

    您的小部件类将不知道StreamBuilder 中的流函数给出的数据类型,有很多方法可以在流式传输之前转换BloC 中的数据,但所有这些都将无用,因为小部件类它只是一个snapshot,您可以在编译时访问的唯一字段是那些应用于像data 字段这样的通用快照的字段。因此,访问自定义列表字段的唯一方法是向您的StreamBuilder 提供其stream 函数预期的数据类型:

      StreamBuilder<List<EstimationResult>>(
        stream: bloc.getReult,
        initialData: CalculationResultProvider().getInitialData(),
        builder: (context, snapshot) {
         //...
        }
      );
    

    通过这种方式,您可以将snapshot 视为List&lt;EstimationResult&gt;,并在收到实际快照之前访问内部字段和函数。在您的情况下,您可能应该将 EstimationResult 类导入到您的小部件类中。

    【讨论】:

    • 谢谢,有什么最佳实践可以实现我的目标吗?
    • 好吧,我对 DataTable 了解不多,也许阅读有关如何填充它们的信息会给您一个想法。
    • 我已经实现了你的解决方案,但问题是如何将 snapshot.data 转换为列表,如果我一次又一次地问同样的事情,请原谅我,
    猜你喜欢
    • 2016-10-28
    • 1970-01-01
    • 2014-02-15
    • 1970-01-01
    • 2020-08-20
    • 2011-01-15
    • 2022-11-17
    • 2021-03-25
    • 2020-08-11
    相关资源
    最近更新 更多