如何在flutter中更改谷歌地图API的“我的位置”按钮位置?

Sha*_*esh 13 google-maps flutter

我正在使用波纹管小部件,我想将 MyLocation 按钮更改为我的地图视图中的底部位置

GoogleMap(

                  onMapCreated: onMapCreated,

              options: GoogleMapOptions(


                    myLocationEnabled :true, 
                    mapType: MapType.hybrid,

                  cameraPosition: CameraPosition(
                    target: LatLng(6.8814635,79.8876697),
                    zoom: 15.0,),
                  ),
    ),
Run Code Online (Sandbox Code Playgroud)

Sha*_*esh 18

我找到了解决方案。我创建 FAB 按钮来更改我的位置按钮

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),
      ),
    );
  }
Run Code Online (Sandbox Code Playgroud)

另外,设置_currentLocation调用我的位置的方法

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,
      ),
    ));
  }
Run Code Online (Sandbox Code Playgroud)

  • 这有效,但速度非常慢,我通过始终使用 location.onLocationChanged.listen((event) { myLocation = event; }); 更新位置来解决它 而不是使用 myLocation = location.getLocation(); 每次我按下按钮 (2认同)

And*_*nto 13

使用GoogleMap 小部件的填充属性

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,),
    ),
  ],
);
Run Code Online (Sandbox Code Playgroud)

图 1:无填充

图 2:带填充

  • 虽然这确实会移动按钮,但它也会移动地图的中心,因此按下按钮可能不会执行预期的行为 (3认同)