Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to change google map API's My Location button postion in flutter?

I'm using bellow widget,I want to change MyLocation button get to bottom position in my map view

GoogleMap(

                  onMapCreated: onMapCreated,

              options: GoogleMapOptions(


                    myLocationEnabled :true, 
                    mapType: MapType.hybrid,

                  cameraPosition: CameraPosition(
                    target: LatLng(6.8814635,79.8876697),
                    zoom: 15.0,),
                  ),
    ),
like image 966
Shadeeka Nimesh Avatar asked Mar 21 '19 02:03

Shadeeka Nimesh


People also ask

How do I change the marker icon on Google Maps Flutter?

import 'dart:ui' as ui; import 'dart:typed_data'; II. Create function for changing the custom image (you will like to use as marker icon )to the byte array.


2 Answers

I found the solution. I create FAB button to change My Location button

GoogleMap(
        mapType: MapType.hybrid,
        initialCameraPosition: _kGooglePlex,
        onMapCreated: (GoogleMapController controller) {
          _controller.complete(controller);
        },
        myLocationEnabled: true,
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: _currentLocation,
        label: Text('My Location'),
        icon: Icon(Icons.location_on),
      ),
    );
  }

also, set the _currentLocation method to call my location

void _currentLocation() async {
   final GoogleMapController controller = await _controller.future;
   LocationData currentLocation;
   var location = new Location();
   try {
     currentLocation = await location.getLocation();
     } on Exception {
       currentLocation = null;
       }

    controller.animateCamera(CameraUpdate.newCameraPosition(
      CameraPosition(
        bearing: 0,
        target: LatLng(currentLocation.latitude, currentLocation.longitude),
        zoom: 17.0,
      ),
    ));
  }
like image 63
Shadeeka Nimesh Avatar answered Oct 17 '22 06:10

Shadeeka Nimesh


Use padding property of GoogleMap widget

return Stack(
  children: <Widget>[
    GoogleMap(
      onMapCreated: _onMapCreated,
      initialCameraPosition: CameraPosition(
        target: _center,
        zoom: 11.0,
      ),
      mapType: _currentMapType,
      markers: _markers,
      onCameraMove: _onCameraMove,
      myLocationEnabled: true,
      padding: EdgeInsets.only(top: 40.0,),
    ),
  ],
);

image 1: without padding

image 2: with padding

like image 21
Andres Pinto Avatar answered Oct 17 '22 06:10

Andres Pinto