我正在使用flutter_map插件,但是即使位置的纬度和经度可以正常工作(它们返回当前位置),地图也不会更新到当前位置,这是代码:(主文件只是重定向到此屏幕,项目中没有其他文件)
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong/latlong.dart';
import 'package:location/location.dart';
final accessToken =
'pk.eyJ1IjoibGlxdWlkZmxhbWUiLCJhIjoiY2s3Ym9zZDNuMGE4ZjNubjIyOTh1eDQzYiJ9.EOzQWdKMBenIC4UuQpwtBA';
class HomeScreen extends StatefulWidget {
static final String routeName = '/home_screen';
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
LatLng _center;
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: Column(
children: <Widget>[
RaisedButton(
onPressed: getCurrentLocation,
child: Text('current location'),
),
Container(
height: 700,
child: FlutterMap(
options: MapOptions(
center: _center,
zoom: 13.0,
),
layers: [
TileLayerOptions(
urlTemplate: "https://api.tiles.mapbox.com/v4/"
"{id}/{z}/{x}/{y}@2x.png?access_token=$accessToken",
additionalOptions: {
'accessToken': accessToken,
'id': 'mapbox.streets',
},
),
MarkerLayerOptions(
markers: [
Marker(
point: _center,
builder: (ctx) => Container(
child: Icon(
Icons.account_circle,
color: Colors.red.shade900,
),
),
),
],
),
],
),
),
],
),
),
);
}
@override
void initState() {
super.initState();
getCurrentLocation();
}
getCurrentLocation() async {
Location location = new 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;
}
}
_locationData = await location.getLocation();
setState(() {
_center = LatLng(_locationData.latitude, _locationData.longitude);
});
}
}
而且,缺少插件文档(或者至少我没有找到它)。
我不是Flutter的专家,但是看起来,一旦您创建了FlutterMap小部件,它便不会随新的_center一起重新加载,如果您看到小部件本身,就可以创建并使用mapcontroller移至其他位置,这将是示例代码:
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong/latlong.dart';
import 'package:location/location.dart';
final accessToken =
'pk.eyJ1IjoibGlxdWlkZmxhbWUiLCJhIjoiY2s3Ym9zZDNuMGE4ZjNubjIyOTh1eDQzYiJ9.EOzQWdKMBenIC4UuQpwtBA';
class HomeScreen extends StatefulWidget {
static final String routeName = '/home_screen';
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
LatLng _center;
MapController _mapController = MapController();
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: Column(
children: <Widget>[
RaisedButton(
onPressed: getCurrentLocation,
child: Text('current location'),
),
Container(
height: 700,
child: FlutterMap(
options: MapOptions(
center: _center,
zoom: 13.0,
),
mapController: _mapController,
layers: [
TileLayerOptions(
urlTemplate: "https://api.tiles.mapbox.com/v4/"
"{id}/{z}/{x}/{y}@2x.png?access_token=$accessToken",
additionalOptions: {
'accessToken': accessToken,
'id': 'mapbox.streets',
},
),
MarkerLayerOptions(
markers: [
Marker(
point: _center,
builder: (ctx) => Container(
child: Icon(
Icons.account_circle,
color: Colors.red.shade900,
),
),
),
],
),
],
),
),
],
),
),
);
}
@override
void initState() {
super.initState();
getCurrentLocation();
}
getCurrentLocation() async {
Location location = new 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;
}
}
_locationData = await location.getLocation();
setState(() {
//_center = LatLng(_locationData.latitude, _locationData.longitude);
_mapController.move(LatLng(_locationData.latitude, _locationData.longitude), 13.0);
});
}
}
希望有帮助!