I am a beginner at learning flutter and dart. I am trying to get my location initially with $lat
and $lng
variables and display it via static google map using an HTTP request but upon clicking the TextButton widget, the application hangs. It display an asynch suspension happens but did not specify what line.
This is my location_input.dart;
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:location/location.dart';
import 'package:http/http.dart' as http;
import 'package:favorite_places/models/place.dart';
class LocationInput extends StatefulWidget {
const LocationInput({super.key});
@override
State<StatefulWidget> createState() {
return _LocationInputState();
}
}
class _LocationInputState extends State<LocationInput> {
PlaceLocation? _pickedLocation;
var _isGettingLocation = false;
String get locationImage {
if (_pickedLocation == null) {
return '';
}
final lat = _pickedLocation!.latitude;
final lng = _pickedLocation!.longitude;
return 'https://maps.googleapis.com/maps/api/staticmap?center=$lat,$lng&zoom=16&size=600x300&maptype=roadmap&markers=color:red%7Clabel:A%7C$lat,$lng&key=AIzaSyBCm2bcVuJjnL6O_FLRTibLUMovOh0E8-Q';
}
void _getCurrentLocation() async {
Location location = Location();
bool serviceEnabled;
PermissionStatus permissionGranted;
LocationData locationData;
serviceEnabled = await location.serviceEnabled();
if (!serviceEnabled) {
serviceEnabled = await location.requestService();
if (!serviceEnabled) {
return;
}
}
permissionGranted = await location.hasPermission();
if (permissionGranted == PermissionStatus.denied) {
permissionGranted = await location.requestPermission();
if (permissionGranted != PermissionStatus.granted) {
return;
}
}
setState(() {
_isGettingLocation = true;
});
locationData = await location.getLocation();
final lat = locationData.latitude;
final lng = locationData.longitude;
if (lat == null || lng == null) {
return;
}
final url = Uri.parse(
'https://maps.googleapis.com/maps/api/geocode/json?latlng=$lat,$lng&key=AIzaSyBCm2bcVuJjnL6O_FLRTibLUMovOh0E8-Q');
final response = await http.get(url);
final resData = json.decode(response.body);
final address = resData['results'][0]['formatted_address'];
setState(() {
_pickedLocation = PlaceLocation(
latitude: lat,
longitude: lng,
address: address,
);
_isGettingLocation = false;
});
}
@override
Widget build(BuildContext context) {
Widget previewContent = Text(
'No Location Chosen',
textAlign: TextAlign.center,
style: Theme.of(context)
.textTheme
.bodyLarge!
.copyWith(color: Theme.of(context).colorScheme.onBackground),
);
if (_pickedLocation != null) {
previewContent = Image.network(
locationImage,
fit: BoxFit.cover,
width: double.infinity,
height: double.infinity,
);
}
if (_isGettingLocation) {
previewContent = const CircularProgressIndicator();
}
return Column(
children: [
Container(
alignment: Alignment.center,
height: 170,
width: double.infinity,
decoration: BoxDecoration(
border: Border.all(
width: 1,
color: Theme.of(context).colorScheme.primary.withOpacity(0.2),
)),
child: previewContent,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
TextButton.icon(
onPressed: _getCurrentLocation,
icon: const Icon(Icons.location_on),
label: const Text('Get Location'),
),
TextButton.icon(
onPressed: () {},
icon: const Icon(Icons.map),
label: const Text('Get Map'),
),
],
),
],
);
}
}
2
Answers
Hope one of these might help
replace de Location package by Geolocator
just follow carefull the steps to install it