apptreesoftware / flutter_google_map_view

A flutter plugin for Google Maps
MIT License
415 stars 190 forks source link

map duplicated and removed tag after back device button #121

Open nitneuq33000 opened 6 years ago

nitneuq33000 commented 6 years ago

I have an issue whith mapview plugin. All is Ok when I press button to send sms, and to read the received sms to launch the map and display the position. but I have a visual issue when I change page with navigator.push and I return to the main page to relaunch the map. At this point when I relaunch the map I have like a stack of two map. If I repeat the manipulation I have three map stack... etc

I have an other issue when I use the back button of the device when the map is open, the map is close but when I relaunch the map the localisation tag are remove. I need to press "fermer" to do mapView.dismiss(); and after this it's OK. but the back button of the device don't do this.

here is my code:

       import 'package:flutter/material.dart';
       import 'package:map_view/map_view.dart';
       import 'dart:async';
       import 'package:sms/sms.dart';

void main() {
 runApp(new MyApp());
 }

class MyApp extends StatelessWidget {
 @override
Widget build(BuildContext context) {
return new MaterialApp(
  title: 'Flutter map Demo',
  theme: new ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: new MyHomePage(title: 'page1'),
 );
}
}

class MyHomePage extends StatefulWidget {
 MyHomePage({Key key, this.title}) : super(key: key);

 final String title;
@override
_MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
 MapView mapView = new MapView();
 CameraPosition cameraPosition;

 String nirbinumber;
 String groupnirbinum;
 String groupsmsmap;
 String grouplat;
 String grouplong;
 double lat;
 double long;

var compositeSubscription = new CompositeSubscription();
var API_KEY = "< >"; // my google api key

SmsMessage _lastMessage = new SmsMessage('', '');
StreamSubscription<SmsMessage> _smsSubscription;

@override
void initState() {

super.initState();

nirbinumber =" XXXXXXXXXX   ";  //my phone number to received test sms

new SmsReceiver().onSmsReceived.listen((SmsMessage msg) {
  RegExp regExp = new RegExp(
    r"^0([0-9]{9})",             //Here is the regex function to match phone number
  );
  var match = regExp.firstMatch(nirbinumber);
  groupnirbinum = match.group(1);
  if (msg.address == "+33$groupnirbinum") {      // wait to received my sms to action
    setState(() {
      _lastMessage = msg;
    });
    RegExp regExp = new RegExp(            //Here is the regex function to match first word of sms (here maps)
      r"^([\w\-]+)",
    );
    var match = regExp.firstMatch(_lastMessage.body);
    groupsmsmap = match.group(1);
    if (groupsmsmap =="maps" ) {
      MapView.setApiKey(" my google map api key ");
      showMap();
    }
  }
}
);
}

@override
Widget build(BuildContext context) {
return new Scaffold(
    appBar: new AppBar(
      title: new Text(widget.title),
    ),
    floatingActionButton: new FloatingActionButton(
      onPressed: () {
        new SmsSender().sendSms(new SmsMessage(nirbinumber,"maps" ));  //function to send sms after onPressed
      },
      child: new Icon(Icons.location_on),
    ), //
    body : new Center(
        child :    new RaisedButton(
            child: const Text('Next page'),
            onPressed: () {

              Navigator.push(
                context,
                new MaterialPageRoute(builder: (context) => new MyHomePage2()),
              );
            }
        )
    )
);
}

showMap() {  // code from the exemple of the mapview plugin
mapView.show(
    new MapOptions(
        mapViewType: MapViewType.hybrid,
        showUserLocation: true,
        initialCameraPosition: new CameraPosition(
            new Location(5.0,0.0),18.0),
        title: "Position de Nirbi"),
    toolbarActions: [new ToolbarAction("Fermer", 1)]);
StreamSubscription sub = mapView.onMapReady.listen((_) {
  mapView.addMarker(new Marker("3", "test",6.0,0.0,
      color:Colors.lightBlue));
  mapView.addMarker(
      new Marker("4", "test2", 5.0,0.0,
        color:Colors.orangeAccent, markerIcon: new MarkerIcon(
          "assets/home_tag_orange.png", //Asset to be used as icon
          width: 130.0, //New width for the asset
          height: 130.0, // New height for the asset
        ),));
  mapView.zoomToFit(padding: 500);
});
sub = mapView.onTouchAnnotation
    .listen((annotation) => print("annotation ${annotation.id} tapped"));
compositeSubscription.add(sub);
sub = mapView.onMapTapped
    .listen((location) => print("Touched location $location"));
compositeSubscription.add(sub);
sub = mapView.onCameraChanged.listen((cameraPosition) =>
    this.setState(() => this.cameraPosition = cameraPosition));
compositeSubscription.add(sub);
sub = mapView.onToolbarAction.listen((id) {
  print("Toolbar button id = $id");
  if (id == 1) {
    mapView.dismiss();
  }
});
compositeSubscription.add(sub);
sub = mapView.onInfoWindowTapped.listen((marker) {
  print("Info Window Tapped for ${marker.title}");
});
compositeSubscription.add(sub);
}
}

class CompositeSubscription {
Set<StreamSubscription> _subscriptions = new Set();
void cancel() {
  for (var n in this._subscriptions) {
  n.cancel();
}
this._subscriptions = new Set();
}
 void add(StreamSubscription subscription) {
this._subscriptions.add(subscription);
 }
 void addAll(Iterable<StreamSubscription> subs) {
_subscriptions.addAll(subs);
 }
  bool remove(StreamSubscription subscription) {
return this._subscriptions.remove(subscription);
  }
  bool contains(StreamSubscription subscription) {
return this._subscriptions.contains(subscription);
  }
  List<StreamSubscription> toList() {
return this._subscriptions.toList();
 }
 }

 class MyHomePage2 extends StatefulWidget { // page 2, to show simulate the issue of duplication of map
MyHomePage2({Key key, this.title2}) : super(key: key);
final String title2;
@override
_MyHomePage2State createState() => new _MyHomePage2State();
}
class _MyHomePage2State extends State<MyHomePage2> {

  @override
   Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
      title: new Text("page2"),
    ),
    body : Center (
        child :    new RaisedButton(
            child: const Text('Previous page'),
            onPressed: () {
              Navigator.push(
                context,
                new MaterialPageRoute(builder: (context) => new MyApp(
                )),
              );
            }
        )
    )
);
 }
}

notice: if I place showMap() like bellow, I have no issues with the duplication of the map but always an issue with back button. But I my context I need to launch the map only when I receive sms with localisation, so in the final code , I can't do this. the map doen't want to be display because there are no localisation to display because sms localisation is received after the map launch in this case.

onPressed: () { //new SmsSender().sendSms(new SmsMessage(nirbinumber,"maps" )); //function to send sms after onPressed MapView.setApiKey(" my google map api key "); showMap(); },