9
votes

Flutter / Dart Ajouter des événements Tap personnalisés pour le marqueur Google Maps

Comment ajouter un gestionnaire personnalisé pour les événements tap pour Google Maps Marker (google_maps_flutter)? Je ne peux voir que consumeTapEvents qui ne prend en fait aucune fonction mais seulement bool. J'ai pensé à utiliser GestureDetector mais ne semble pas tout à fait correct.

Quelle est la manière standard de gérer les événements sur les marqueurs de Google Map? J'essaye d'accéder à une nouvelle page après un clic.

Merci


0 commentaires

6 Réponses :


1
votes

Gardez à l'esprit que la version actuelle est un aperçu pour les développeurs à la version 0.0.3. Donnez-lui un peu de temps pour faire fonctionner les choses, s'il vous plaît!


2 commentaires

Tous les biens :) donc la réponse serait: il n'y en a pas encore. Correct?


S'il n'est pas répertorié sur la page API, il n'existe pas encore.



0
votes

Vous pouvez faire quelque chose comme

_mapController.onMarkerTapped.add((marker) {
      // your code here
    });

_mapController est une instance de GoogleMapController :)


1 commentaires

comment ajouter une méthode dans ce code..je veux sélectionner l'emplacement et obtenir cette lat, longue de l'endroit



2
votes
     void _onMapCreated(GoogleMapController controller){
    this._controller = controller;
    controller.onMarkerTapped.add(_onMarkerTapped);
}

void _onMarkerTapped(Marker marker) {
...
}

Widget build(BuildContext context) {
 ... GoogleMap(
        onMapCreated: _onMapCreated,
        options: GoogleMapOptions(
          ...
        ));
}

1 commentaires

controller.onMarkerTapped.add (_onMarkerTapped); pour une raison quelconque .. cela ne fonctionne plus.



0
votes

Créez un objet personnalisé lorsque vous créez des marqueurs.

var map = <String, String> {}; // custom object

for (int i = 0; i < mCrag.length; i++) {
    controller.addMarker(new MarkerOptions(
       icon: BitmapDescriptor.fromAsset('assets/images/down-arrow.png'),
       position: LatLng(double.parse(mCrag[i].lat), double.parse(mCrag[i].lon)),
    )).then((marker) {
         map[marker.id] = mCrag[i].id; // this will return when tap on marker
         return marker;
    });
}

// marker click event
void onMarkerTapped(Marker marker) {
   var selectedMarker = map[marker.id];  // here you will get your id.
   debugPrint(selectedMarker);
   getRoutes(selectedMarker);
}


0 commentaires

19
votes

Avec la sortie de la version ^ 0.3.0 + 1, une nouvelle API Marker a été introduite qui gère les marqueurs comme des widgets (y compris une méthode onTap ()). De cette façon, une carte Google a une option marqueurs: qui admet une liste d'objets marqueurs. Chacun des éléments peut être défini comme ceci:

Marker(
  markerId: MarkerId("id"), // a string for marker unique id
  icon: BitmapDescriptor.defaultMarker(), // options for hues and custom imgs
  position: LatLng(lat, long), // lat and long doubles

  onTap: () {
    //this is what you're looking for!
  }

),

Beaucoup plus facile que l'ancienne approche du contrôleur!


0 commentaires

2
votes

Vous pouvez utiliser l'option onTap ou onLongPress dans le plugin de carte pour surveiller les événements de tap. Ensuite, vous pouvez ajouter le marqueur de la manière suivante sur la position tapée

 void _onAddMarkerButtonPressed(LatLng latlang) {
loadAddress(latlang);
_latLng = latlang;
 setState(() {
  _markers.add(Marker(
    // This marker id can be anything that uniquely identifies each marker.
    markerId: MarkerId(_lastMapPosition.toString()),
    position: latlang,
    infoWindow: InfoWindow(
      title: address,
    //  snippet: '5 Star Rating',
    ),
    icon: BitmapDescriptor.defaultMarker,
  ));
});
}

où se trouve la fonction _onAddMarkerButtonPressed

    final Set<Marker> _markers = {};



 GoogleMap(onMapCreated: _onMapCreated,
        initialCameraPosition: CameraPosition(
          target: _center,
          zoom: 13.0,
        ),
        compassEnabled: true,
        tiltGesturesEnabled: false,
        onTap: (latlang){
          if(_markers.length>=1)
            {
              _markers.clear();
            }

          _onAddMarkerButtonPressed(latlang);
        },
        myLocationEnabled: true,
        myLocationButtonEnabled: true,
        mapType: mapType,
        markers: _markers,
        onCameraMove: _onCameraMove,
      ),


0 commentaires