Радиус изменения флаттера нарисованного круга кнопками - PullRequest
1 голос
/ 09 июля 2020

Как продолжение статьи по этой ссылке. Я работаю над проектом Flutter, в котором я хочу увеличить радиус круга с помощью двух кнопок.

Теперь мне частично удалось, но это пока не работает достаточно хорошо. Я действительно не знаю, как это объяснить, но я постараюсь изо всех сил:

Случилось так, что как только я нажму кнопку «минус», он станет на шаг меньше. Если я снова нажму кнопку «минус», он снова станет немного меньше. Но как только я снова нажимаю на плюс, он остается того же размера, пока я не передам номер, который был самым большим.

A видео проблемы, если ее четко не объяснить .

Может кто знает как с этим справиться?

введите описание изображения здесь

Код (лишний код удален):

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()),
      ));
    });
  }

1 Ответ

1 голос
/ 09 июля 2020

круг - это набор, набор не позволяет повторять объекты, в addRadiusToMap вы добавляете новый объект Circle, но если есть предыдущий с такими же полями (7 и 8 уже существуют), он не будет добавлять это, я думаю, что виджет GoogleMaps не видит изменений в Set<Circle> и не обновляет / не анимирует новый круг, а пока попробуйте добавить circle.clear() перед добавлением, если добавление вернет 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>, но, насколько я понимаю код, набор на самом деле не обновляется, потому что у вас уже есть эти значения

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...