CODEWITHSUNDEEP
google-mapsgoogle-maps-api-3dartfluttergoogle-maps-api-2
TSR
TSR

Reputation: 20607

Customize the center location button in Flutter Google Map

I am using google_maps_flutter: ^0.0.3+3

How do I remove the default square button to center location and still keep the blue dot current position ?

If it is not possible, how to customize it ?

enter image description here

Upvotes: 9

Views: 6703

Answers (3)

awshakam98
awshakam98

Reputation: 495

I solved this problem by adding this function

 void setInitialLocation() async {
    currentLocation = await location.getLocation();
    destinationLocation = LOC.LocationData.fromMap({
      "latitude": currentLocation.latitude,
      "longitude": currentLocation.longitude
    });
    CameraPosition cPosition = CameraPosition(
      zoom: CAMERA_ZOOM,
      tilt: CAMERA_TILT,
      bearing: CAMERA_BEARING,
      target: LatLng(currentLocation.latitude, currentLocation.longitude),
    );
    final GoogleMapController controller = await _controller.future;
    controller
        .animateCamera(CameraUpdate.newCameraPosition(cPosition))
        .then((value) {
      setState(() {
        isCameraMoved = false;
      });
    });
  }

and add this widget into stack under googleMap :

Align(
              alignment: Alignment.topRight,
              child: Container(
                height: 60,
                width: 60,
                padding: EdgeInsets.all(10.0),
                child: FloatingActionButton(
                  backgroundColor: Colors.white,
                  heroTag: 'recenterr',
                  onPressed: () {
                    setInitialLocation();
                  },
                  child: Icon(
                    Icons.my_location,
                    color: Colors.grey,
                  ),
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(10.0),
                      side: BorderSide(color: Color(0xFFECEDF1))),
                ),
              ),
            ),

Upvotes: 0

Isuru Dilshan
Isuru Dilshan

Reputation: 829

Set following properties on GoogleMap object:

myLocationButtonEnabled: false,
myLocationEnabled: true,

Work with google_maps_flutter: ^0.5.13

Upvotes: 12

Oliver Series
Oliver Series

Reputation: 11

As it stands this isn't possible, the only possible work around would be to design your UI so that it blocks it.

Upvotes: 1

Related Questions