search

fleaflet / flutter_map

A versatile mapping package for Flutter. Simple and easy to learn, yet completely customizable and configurable, it's the best choice for mapping in your Flutter app.
https://pub.dev/packages/flutter_map
BSD 3-Clause "New" or "Revised" License
2.73k stars 859 forks source link

How to set onTap on initialized marker? #1009

Closed paulks-software closed 3 years ago

paulks-software commented 3 years ago

Hello how to set onTap on initialized marker?

i have declared marker in a class _HomePageState extends State if i try to add onTap it says The instance member 'setStateText' can't be accessed in an initializer. Try replacing the reference to the instance member with a different expression

how to initialize marker and set a functionthat it would change state and change text? Thank you!

   Marker gps = Marker(
    width: 30,
    height: 30,
    point: LatLng(gpsLocLat, gpsLocLng),
    builder: (ctx) => Container(
        child: GestureDetector(
      onTap: () {
        log("yes");
  // DONT WORK! says  The instance member 'setStateText' can't be accessed in an initializer.
Try replacing the reference to the instance member with a different expression
        setStateText(); 

        //  stateText = 'onTapChangeThis';
      },
      child: Icon(
        Icons.circle,
        size: 30,
        color: Colors.black, //
      ),
    )),
  );
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
import 'package:fluttertoast/fluttertoast.dart';

import '../widgets/drawer.dart';

void log(msg) {
  // Fluttertoast.cancel();
  msg = msg.toString();
  if (msg == null) {
  } else {
    Fluttertoast.showToast(
        msg: msg,
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        backgroundColor: Colors.black,
        fontSize: 25.0);
  }
  //statements
}

String stateText = "change";

List<Marker> marker_array = [];

double gpsLocLat = 54.623320;
double gpsLocLng = 24.936982;

LatLng newLat = LatLng(54.523320, 22.936982);

class HomePage extends StatefulWidget {
  static const String route = '/';

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  setStateText() {
    stateText = 'onTapChangeThis';
  }

  Marker gps = Marker(
    width: 30,
    height: 30,
    point: LatLng(gpsLocLat, gpsLocLng),
    builder: (ctx) => Container(
        child: GestureDetector(
      onTap: () {
        log("yes");
        setStateText();
        // DONT WORK!
        //  stateText = 'onTapChangeThis';
      },
      child: Icon(
        Icons.circle,
        size: 30,
        color: Colors.black, //
      ),
    )),
  );

  Marker marker1 = Marker(
    width: 30,
    height: 30,
    point: LatLng(54.523320, 22.836982),
    builder: (ctx) => Container(
        child: GestureDetector(
      onTap: () {},
      child: Icon(
        Icons.circle,
        size: 30,
        color: Colors.green, //
      ),
    )),
  );

  Marker marker2 = Marker(
    width: 30,
    height: 30,
    point: LatLng(54.623320, 22.836982),
    builder: (ctx) => Container(
        child: GestureDetector(
      onTap: () {},
      child: Icon(
        Icons.circle,
        size: 30,
        color: Colors.green, //
      ),
    )),
  );
  Marker marker3 = Marker(
    width: 30,
    height: 30,
    point: LatLng(54.623320, 22.936982),
    builder: (ctx) => Container(
        child: GestureDetector(
      onTap: () {},
      child: Icon(
        Icons.circle,
        size: 30,
        color: Colors.green, //
      ),
    )),
  );
  addMarkers(Marker marker) {
    marker_array.add(marker);
  }

  removeMarkers(Marker marker) {
    marker_array.remove(marker);
  }

  Widget FlutterMap1() {
    return Stack(
      children: <Widget>[
        Column(
          children: <Widget>[
            Flexible(
              child: FlutterMap(
                options: MapOptions(
                  center: LatLng(54.4078, 23.2805),
                  zoom: 7.0,
                  minZoom: 3.0,
                  maxZoom: 13.0,
                  // rotation bug
                  // interactiveFlags: InteractiveFlag.all & ~InteractiveFlag.rotate,
                  // swPanBoundary: LatLng(53.4078, 22.2805),
                  // nePanBoundary: LatLng(55.4078, 24.2805),
                ),
                layers: [
                  TileLayerOptions(
                      urlTemplate:
                          'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                      subdomains: ['a', 'b', 'c']),

                  /* TileLayerOptions(
                      tileProvider: FileTileProvider(),
                      urlTemplate:
                          '${DownloadAssetsController.assetsDir}/tiles/project/{z}/{x}/{y}.png',
                    ),*/
                  MarkerLayerOptions(markers: marker_array)
                ],
              ),
            )
          ],
        ),

        // bottom drawer

        //
      ],
    );
  }

  change_loc() {
    if (marker_array.contains(gps)) {
      print("still contains");
      // removeMarkers(gps);
    } else {
      print("let`s add a new location");
      gpsLocLat = gpsLocLat + 0.1;
      gpsLocLng = gpsLocLng + 0.1;
      gps = Marker(
        width: 30,
        height: 30,
        point: LatLng(gpsLocLat, gpsLocLng),
        builder: (ctx) => Container(
            child: GestureDetector(
          onTap: () {},
          child: Icon(
            Icons.circle,
            size: 30,
            color: Colors.black, //
          ),
        )),
      );
      addMarkers(gps);
    }
  }

  @override
  Widget build(BuildContext context) {
    //addMarkers();
    return Scaffold(
      appBar: AppBar(title: Text('Home')),
      body: Padding(
        padding: EdgeInsets.all(8.0),
        child: Column(
          children: [
            ElevatedButton(
              onPressed: () => setState(() {
                if (marker_array.contains(marker1)) {
                } else {
                  addMarkers(marker1);
                  print("added");
                }
                if (marker_array.contains(marker2)) {
                } else {
                  addMarkers(marker2);
                  print("added");
                }

                if (marker_array.contains(gps)) {
                } else {
                  addMarkers(gps);
                  print("added");
                }
              }),
              child: Text("ADD"),
            ),
            ElevatedButton(
              onPressed: () => setState(() {
                if (marker_array.contains(marker1)) {
                  removeMarkers(marker1);
                  print("removed");
                } else {}

                if (marker_array.contains(gps)) {
                  removeMarkers(gps);
                  print("removed");
                } else {}
              }),
              child: Text("REMOVE"),
            ),
            ElevatedButton(
              onPressed: () => setState(() {
                removeMarkers(gps);
                print("removed");
                if (marker_array.contains(gps)) {
                  print("still contains");
                } else {
                  print("execute change");
                  change_loc();
                }

                // LatLng newLat = LatLng(54.523320, 22.936982);
              }),
              child: Text("SETLOC"),
            ),
            Text(stateText),
            Flexible(
              child: FlutterMap1(),
            ),
          ],
        ),
      ),
    );
  }
}
paulks-software commented 3 years ago

import 'package:flutter/material.dart'; import 'package:flutter_map/flutter_map.dart'; import 'package:latlong2/latlong.dart'; import 'package:fluttertoast/fluttertoast.dart';

import '../widgets/drawer.dart';

void log(msg) { // Fluttertoast.cancel(); msg = msg.toString(); if (msg == null) { } else { Fluttertoast.showToast( msg: msg, toastLength: Toast.LENGTH_SHORT, gravity: ToastGravity.CENTER, backgroundColor: Colors.black, fontSize: 25.0); } //statements }

String stateText = "change";

List marker_array = [];

double gpsLocLat = 54.623320; double gpsLocLng = 24.936982;

LatLng newLat = LatLng(54.523320, 22.936982);

class HomePage extends StatefulWidget { static const String route = '/';

@override _HomePageState createState() => _HomePageState(); }

class _HomePageState extends State { Marker marker1 = Marker( width: 30, height: 30, point: LatLng(54.523320, 22.836982), builder: (ctx) => Container( child: GestureDetector( onTap: () {}, child: Icon( Icons.circle, size: 30, color: Colors.green, // ), )));

@override void initState() { void mrk() { setState(() { print("2"); stateText = '3'; }); }

marker1 = Marker(
  width: 30,
  height: 30,
  point: LatLng(54.523320, 22.836982),
  builder: (ctx) => Container(
      child: GestureDetector(
    onTap: () {
      print("1");
      mrk();
    },
    child: Icon(
      Icons.circle,
      size: 30,
      color: Colors.green, //
    ),
  )),
);

super.initState();

}

Marker gps = Marker( width: 30, height: 30, point: LatLng(gpsLocLat, gpsLocLng), builder: (ctx) => Container( child: GestureDetector( onTap: () { log('yes');

    // mrk();
    // DONT WORK!
    //  stateText = 'onTapChangeThis';
  },
  child: Icon(
    Icons.circle,
    size: 30,
    color: Colors.black, //
  ),
)),

);

Marker marker2 = Marker( width: 30, height: 30, point: LatLng(54.623320, 22.836982), builder: (ctx) => Container( child: GestureDetector( onTap: () {}, child: Icon( Icons.circle, size: 30, color: Colors.green, // ), )), ); Marker marker3 = Marker( width: 30, height: 30, point: LatLng(54.623320, 22.936982), builder: (ctx) => Container( child: GestureDetector( onTap: () {}, child: Icon( Icons.circle, size: 30, color: Colors.green, // ), )), ); addMarkers(Marker marker) { marker_array.add(marker); }

removeMarkers(Marker marker) { marker_array.remove(marker); }

Widget FlutterMap1() { // setOnTap(); return Stack( children: [ Column( children: [ Flexible( child: FlutterMap( options: MapOptions( center: LatLng(54.4078, 23.2805), zoom: 7.0, minZoom: 3.0, maxZoom: 13.0, // rotation bug // interactiveFlags: InteractiveFlag.all & ~InteractiveFlag.rotate, // swPanBoundary: LatLng(53.4078, 22.2805), // nePanBoundary: LatLng(55.4078, 24.2805), ), layers: [ TileLayerOptions( urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', subdomains: ['a', 'b', 'c']),

              /* TileLayerOptions(
                  tileProvider: FileTileProvider(),
                  urlTemplate:
                      '${DownloadAssetsController.assetsDir}/tiles/project/{z}/{x}/{y}.png',
                ),*/
              MarkerLayerOptions(markers: marker_array)
            ],
          ),
        )
      ],
    ),

    // bottom drawer

    //
  ],
);

}

change_loc() { if (marker_array.contains(gps)) { print("still contains"); // removeMarkers(gps); } else { print("let`s add a new location"); gpsLocLat = gpsLocLat + 0.1; gpsLocLng = gpsLocLng + 0.1; gps = Marker( width: 30, height: 30, point: LatLng(gpsLocLat, gpsLocLng), builder: (ctx) => Container( child: GestureDetector( onTap: () {}, child: Icon( Icons.circle, size: 30, color: Colors.black, // ), )), ); addMarkers(gps); } }

@override Widget build(BuildContext context) { //addMarkers(); return Scaffold( appBar: AppBar(title: Text('Home')), body: Padding( padding: EdgeInsets.all(8.0), child: Column( children: [ ElevatedButton( onPressed: () => setState(() { if (marker_array.contains(marker1)) { } else { addMarkers(marker1); print("added"); } if (marker_array.contains(marker2)) { } else { addMarkers(marker2); print("added"); }

            if (marker_array.contains(gps)) {
            } else {
              addMarkers(gps);
              print("added");
            }
          }),
          child: Text("ADD"),
        ),
        ElevatedButton(
          onPressed: () => setState(() {
            if (marker_array.contains(marker1)) {
              removeMarkers(marker1);
              removeMarkers(marker2);
              print(marker_array.length.toString());
              print("removed");
            } else {}

            if (marker_array.contains(gps)) {
              removeMarkers(gps);
              print("removed");
            } else {}
          }),
          child: Text("REMOVE"),
        ),
        ElevatedButton(
          onPressed: () => setState(() {
            removeMarkers(gps);
            print("removed");
            if (marker_array.contains(gps)) {
              print("still contains");
            } else {
              print("execute change");
              change_loc();
            }

            // LatLng newLat = LatLng(54.523320, 22.936982);
          }),
          child: Text("SETLOC"),
        ),
        Text(stateText),
        Flexible(
          child: FlutterMap1(),
        ),
      ],
    ),
  ),
);

} }