使用谷歌地图颤动单击按钮时如何激活位置？

Posted 2023-02-23

【中文标题】使用谷歌地图颤动单击按钮时如何激活位置？

【英文标题】：How to activate location when clicking on button using google maps flutter?

【发布时间】：2019-08-18 19:17:36

【问题描述】：

我是使用 Flutter 的新手，我正在制作一个应用程序。因为我需要使用谷歌地图并仅在通过按钮激活时显示我的位置。

我使用的例子是：

https://pub.dartlang.org/packages/google_maps_flutter

这给了你一个将相机重定向到某个点的按钮，但是我怎样才能把那个按钮变成使用我的位置的触发器呢？

我做了这样的事情，但我得到一个错误：

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:location/location.dart' as LocationManager;

void main() => runApp(Lugares());

class Lugares extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      title: 'Lugares',
      home: MapSample(),
      debugShowCheckedModeBanner: false,
    );
  


class MapSample extends StatefulWidget 
  @override
  State<MapSample> createState() => MapSampleState();


class MapSampleState extends State<MapSample> 
  Completer<GoogleMapController> _controller = Completer();

  static final CameraPosition _kGooglePlex = CameraPosition(
    target: LatLng(37.42796133580664, -122.085749655962),
    zoom: 14.4746,
  );

  static final CameraPosition _kLake = CameraPosition(
      bearing: 192.8334901395799,
      target: LatLng(37.43296265331129, -122.08832357078792),
      tilt: 59.440717697143555,
      zoom: 19.151926040649414);

  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      body: GoogleMap(
        mapType: MapType.hybrid,
        initialCameraPosition: _kGooglePlex,
        onMapCreated: (GoogleMapController controller) 
          _controller.complete(controller);
        ,
        myLocationEnabled: true,
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: _goToTheLake,
        label: Text('To the lake!'),
        icon: Icon(Icons.directions_boat),
      ),
    );
  

  Future<void> _goToTheLake() async 
    final GoogleMapController controller = await _controller.future;
    controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(
        target: getUserLocation() == null ? LatLng(0, 0) : getUserLocation(), zoom: 15.0)));
  

  Future<LatLng> getUserLocation() async 
    var currentLocation = <String, double>;
    final location = LocationManager.Location();
    try 
      currentLocation = (await location.getLocation()) as Map<String, double>;
      final lat = currentLocation["latitude"];
      final lng = currentLocation["longitude"];
      final center = LatLng(lat, lng);
      return center;
     on Exception 
      currentLocation = null;
      return null;
    
  

更新：

感谢@Vishal G. Gohel 分享他的代码，我可以完成我想要的，这就是代码：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:location/location.dart';

void main() => runApp(Lugares());

class Lugares extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      title: 'Lugares',
      home: MapSample(),
      debugShowCheckedModeBanner: false,
    );
  


class MapSample extends StatefulWidget 
  @override
  State<MapSample> createState() => MapSampleState();


class MapSampleState extends State<MapSample> 
  Completer<GoogleMapController> _controller = Completer();

  static final CameraPosition _kGooglePlex = CameraPosition(
    target: LatLng(37.42796133580664, -122.085749655962),
    zoom: 14.4746,
  );

  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      body: GoogleMap(
        mapType: MapType.hybrid,
        initialCameraPosition: _kGooglePlex,
        onMapCreated: (GoogleMapController controller) 
          _controller.complete(controller);
        ,
        myLocationEnabled: true,
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: _currentLocation,
        label: Text('Ir a mi Ubicacion!'),
        icon: Icon(Icons.location_on),
      ),
    );
  



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,
      ),
    ));
  

【问题讨论】：

你遇到了什么错误？

@VishalG.Gohel 我收到此错误：_TypeError（类型 'Future' 不是类型 'LatLng' 的子类型）

很高兴听到这个消息。

【参考方案1】：

您可以查看我为获取当前位置所做的以下方法。

void _currentLocation() async 
    Location _location = new Location();
    Map<String, double> location;

    try 
      location = await _location.getLocation();
     on PlatformException catch (e) 
      print(e.message);
      location = null;
    

    mapController.animateCamera(CameraUpdate.newCameraPosition(
      CameraPosition(
        bearing: 0,
        target: LatLng(location["latitude"], location["longitude"]),
        zoom: 17.0,
      ),
    ));

    mapController.addMarker(
      MarkerOptions(
        position: LatLng(location["latitude"], location["longitude"]),
      ),
    );
  

【讨论】：

不幸的是 API 发生了变化，addMarker 不再工作，点击这里查看现在是如何完成的***.com/questions/55000043/…

【参考方案2】：

更新答案

 void _current_location() async 
final GoogleMapController controller = await _controller.future;

var makerIdValue = "val";
final MarkerId markerId = MarkerId(makerIdValue);

LocationData location;
var _location = new Location();
try 
  location = await _location.getLocation();
 catch (e) 
  print('ERROR' + e.toString());
  location = null;


controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(
    bearing: 0,
    target: LatLng(location.latitude, location.longitude),
    zoom: 17.0)));

//create marker
final Marker marker = Marker(
  markerId: markerId,
  position: LatLng(location.latitude, location.longitude),
);

setState(() 
  markers[markerId] = marker;
);