Flutter Map on position change end

Question

I am using flutter_map to add a map to my project. I am able to work with it and use its options. But I want something that I did not find in flutter_map.

I want to listen to a position change and get the last position when the user stops touching the screen. Like the onTapUp or onLongPressUp in the GestureDetector widget.

There is onPositionChanged option in flutter_map but it gets called every time the position is changing, which is a lot. As soon as the user touched the screen, the onPositionChanged gets called until the user stops touching the screen. I can get the last position from this, but I want to call an API when the position changes to get the list of nearby cars. Calling API every time the onPositionChanged gets called is not good.

So I want to be able to call the API when the user finishes changing location (when he/she stops touching the screen).

Here is my flutter_map code:

     FlutterMap(
            key: Key('map'),
            mapController: main.mapController,

            options: MapOptions(
                center: LatLng(main.lat, main.long),
                zoom: 14,
                maxZoom: 18,
                minZoom: 10,
                onPositionChanged: (mapPosition, boolValue){
                  _lastposition = mapPosition.center;
                }),


            layers: [
              TileLayerOptions(
                errorImage: AssetImage('images/login_icon.png'),
                urlTemplate:
                    "https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}.png",
                // subdomains: ['a', 'b', 'c'],
                // subdomains: ['', '1', '2', '3', '4']
              ),
              MarkerLayerOptions(
                markers: main.markersStart +
                    main.markersDestination +
                    main.driverMarkers,
              ),
            ],
          ),

Any help would be appreciated, thanks :).

I work with `google_map_flutter` and it has `onCameraIdle` method, that return the position after user stop moving map — Amir, Jun 16 '20 at 10:45
@veneno thanks. I want to upload the OSM map on my server. So I can not change the map to google maps. — Arash Mohammadi, Jun 17 '20 at 07:05

score 6 · Answer 1 · answered Sep 22 '21 at 16:55

The best solution I found was to add a listener on MapEventStream (check events here: map_events.dart)

  MapController mapController;
  StreamSubscription subscription;

  @override
  void initState() {
    mapController = MapController();

    mapController.onReady.then((_) {
      subscription = mapController.mapEventStream.listen((MapEvent mapEvent) {
        if (mapEvent is MapEventMoveStart) {
          print(DateTime.now().toString() + ' [MapEventMoveStart] START');
          // do something
        }
        if (mapEvent is MapEventMoveEnd) {
          print(DateTime.now().toString() + ' [MapEventMoveStart] END');
          // do something
        }
      });
    });
    super.initState();
  }

  @override
  void dispose() {
    subscription.cancel();
    super.dispose();
  }

Many thanks to this post that helps me

This works great. Don't know why you didn't get 10000 up votes. Thanks a lot! — Nils Tierecke, Jan 19 '22 at 15:04

score 1 · Answer 2 · answered Jul 02 '22 at 17:56

The easiest way I guess is to define a Timer like so:

Timer? timer;
....

And then inside onPositionChanged event, first reset it (actually reseting the old timer), then set it again. Using this, print is called only once and 1 second after changing position ends

FlutterMap(
  ...
  options: MapOptions(
    onPositionChanged: (MapPosition position, bool hasGesture) {
      timer?.cancel();

      timer = Timer(Duration(milliseconds: 1000), () {
        print(position);
      });
    }
  ),
  ...
)

score -1 · Answer 3 · answered Jul 04 '20 at 15:09

-1

You can use a timer, which executes only after a one second delay.

onPositionChanged: (mapPosition, boolValue) {
              Timer(Duration(seconds: 1), () {}}

answered Jul 04 '20 at 15:09

N Sivaram

298
1
11

2

This will just throw the same multiple events a second later than they would have been thrown :-) – Simon Hutton Oct 05 '20 at 20:12

Flutter Map on position change end

3 Answers3