I am new using Flutter and i am making a app. In that i need to use google maps and show my location only if activated by a button.
I am using the example in:
https://pub.dartlang.org/packages/google_maps_flutter
That give you a button that redirect the camera to a certain point, but how can i turn that button to be the trigger of using my location or not?
I made something like this but i get an error:
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;
}
}
}
UPDATE:
Thanks to @Vishal G. Gohel that share his code i could acomplish what i want, this is the code:
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,
),
));
}
}
You can check below method which i made for get current location.
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"]),
),
);
}
updated answer
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;
});
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With