Question

作为this链接文章的后续内容。我正在开发Flutter项目，该项目中我想通过两个按钮来增加圆的半径。

现在我已经部分成功了，但是还不能很好地工作。我真的不知道该怎么解释，但我会尽力的：

发生的事情是，当我按下减号按钮时，它变小了一步。如果再次按下减号按钮，它将再次变小。但是当我再次按下加号时，它会保持不变，直到我通过最高的数字为止。

问题video，如果无法清楚地解释。

也许有人知道如何处理？

代码（已删除不必要的代码）：

class _AddRayPageState extends State<AddRayPage> {

  List<Marker> myMarker = [];
  final Set<Circle> circle = {};
  GoogleMapController mapController;
  int _n = 8;
  LatLng startLoc = LatLng(52.0907374, 5.1214201);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Toevoegen'),
      ),
      body: Stack(children: <Widget>[
        GoogleMap(
          onMapCreated: onMapCreated,
          markers: Set.from(myMarker),
          initialCameraPosition: CameraPosition(target: startLoc, zoom: 8),
          circles: circle,
        ),
      ]),
      floatingActionButton: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.only(left: 40.0),
            child: Container(
              child: Row(
                children: <Widget>[
                  Container(
                    width: 40.0,
                    height: 40.0,
                    child: new FloatingActionButton(
                      heroTag: "btnAdd",
                      onPressed: add,
                      child: new Icon(
                        Icons.add,
                        color: Colors.black,
                        size: 30,
                      ),
                      backgroundColor: Colors.white,
                    ),
                  ),
                  new Text('$_n', style: new TextStyle(fontSize: 40.0)),
                  Container(
                    width: 40.0,
                    height: 40.0,
                    child: new FloatingActionButton(
                      heroTag: "btnMinus",
                      onPressed: minus,
                      child: new Icon(
                        const IconData(0xe15b, fontFamily: 'MaterialIcons'),
                        color: Colors.black,
                        size: 30,
                      ),
                      backgroundColor: Colors.white,
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  void add() {
    setState(() {
      _n++;
    });
    addRadiusToMap(_n);
  }

  void minus() {
    setState(() {
      if (_n != 1) _n--;
    });
    addRadiusToMap(_n);
  }

  void addRadiusToMap(radius) {
    setState(() {
      double reciprocal(double d) => 1000 * d;
      circle.add(Circle(
        circleId: CircleId("1"),
        center: startLoc,
        radius: reciprocal(radius.toDouble()),
      ));
    });
  }

Answer 1

circle是一个Set，Set不允许重复的对象，在addRadiusToMap中，您要添加一个新的Circle对象，但是如果以前的一个对象具有相同的字段（已经存在7和8），则不会添加它，我认为GoogleMaps小部件在Set<Circle>中没有看到变化，也没有更新/设置新的Circle的动画，现在尝试在添加前返回circle.clear()，如果add return false（返回false并且设置没有更改）

  void add() {
    setState(() {
      _n++;
      addRadiusToMap(_n);
    });
  }

  void minus() {
    if (_n != 1)
      setState(() {
        _n--;
        addRadiusToMap(_n);
      });
  }

  void addRadiusToMap(radius) {
    //No purpose in having 2 setState
    double reciprocal(double d) => 1000 * d;
    circle.clear(); //Maybe clear the set before adding to avoid repeated values
    circle.add(Circle(
      circleId: CircleId("1"),
      center: startLoc,
      radius: reciprocal(radius.toDouble()),
    ));

  }

我不确定（我没有使用过Google Maps软件包）拥有Set<Circle>的目的是什么，但是据我了解的代码，Set并没有真正更新，因为您已经拥有这些值

颤动通过按钮更改绘制圆的半径

1 个答案: