Question

我最近开始学习Flutter，并在Flutter中学习了反应式编程（实际上是学习它）。这就是我想要的，我有一个PieChart，它以地图为输入并进行绘制。（假设地图地图= {“食物”：5，“运输”：2} 我想要做的是有一个按钮，当我单击该按钮时，食物将增加1，然后PieChart将重新呈现。（最终，该按钮将允许用户添加自己的字符串和int，但现在我进行硬编码进行测试）我的想法是让PieChart用StreamBuilder包装，当我们向该流添加输入时，它将监视流并重建PieChart。我只是不知道如何正确实现它，我也不知道我是否应该让该流进入地图中，或者不知道某个类例如称为deposit的类，该类具有字符串和双精度型。这是我的样板：

import 'package:flutter/material.dart';
import 'package:pie_chart/pie_chart.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Map<String, double> dataMap = {"Food": 5, "Transportation": 3};

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Testing"),
        ),
        body: PieChart(dataMap: dataMap),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () {
            dataMap["Food"] = dataMap["Food"] + 1;
          },
        ),
      ),
    );
  }
}

Answer 1

import 'package:flutter/material.dart';
import 'package:pie_chart/pie_chart.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Map<String, double> dataMap = {"Food": 5, "Transportation": 3};

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Testing"),
        ),
        body: PieChart(dataMap: dataMap),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () {
            setState(() => dataMap["Food"] += 1);

          },
        ),
      ),
    );
  }
}

您需要做的就是使用setState告诉小部件状态已更改。 https://docs.flutter.io/flutter/widgets/State/setState.html

此模式受Reactjs启发。注意：请勿在{{1}}回调中放置计算繁重的操作

这是流的一个例子

https://github.com/flutter/plugins/blob/master/packages/sensors/example/lib/main.dart

我没有Stream功能，所以我无法编写代码。

Answer 2

如果您真的想了解Streams的基础知识以及如何使用它，this是您要找的帖子，您可以从中学到很多东西。

您甚至可以从Thomas Burkhart那里学到更多东西，甚至可以使用一种称为RxVMS的新模式。

如何在此PieChart上使用流

2 个答案: