我是 Flutter 的新手，我使用該flutter_google_maps包創建了一個谷歌地圖。
我的父小部件中有以下代碼，
SizedBox(
child: _showFindHouseModal
? FutureBuilder<Address?>(
future: _locationDataFuture,
builder: (context, snapshot) {
if (snapshot.hasData) {
return Map(
initialLatitude: _userLocation.latitude!.toDouble(),
initialLongitude: _userLocation.longitude!.toDouble(),
markers: const [],
);
}
},
)
: FutureBuilder<Address?>(
future: _showFindHouseModal,
builder: (context, snapshot) {
if (snapshot.hasData) {
return Map( // <---------------------------------------- This one is the problem
initialLongitude: _userLocation.latitude!.toDouble(),
initialLatitude: _userLocation.latitude!.toDouble(),
markers: [
Marker(
markerId: MarkerId('${_housesList.first.id}'),
position: LatLng(_housesList.first.houseLatitude, _housesList.first.houseLongitude),
),
],
);
}
}),
),
在上面的代碼中，您可以看到我使用了三元運算子。如果_showFindHouseModal為真，Map則構建了一個小部件。如果它不是真的，Map將構建相同的小部件，但帶有額外的標記。問題是，我轉發的那些附加標記沒有呈現在螢屏上。
不過，我想我找到了問題所在。它在子小部件中。（就是我找不到解決問題的辦法）
讓我展示子小部件的代碼。
class Map extends StatefulWidget {
final List<Marker> markers;
final double initialLatitude;
final double initialLongitude;
const Map({
Key? key,
required this.initialLatitude,
required this.initialLongitude,
required this.markers, // Todo: Make the default to an empty value
}) : super(key: key);
@override
State<Map> createState() => MapState();
}
class MapState extends State<Map> {
late final CameraPosition _initialCameraPosition;
late final Set<Marker> _markers = {};
final Completer<GoogleMapController> _controller = Completer();
@override
void initState() {
super.initState();
_initialCameraPosition = CameraPosition(
target: LatLng(widget.initialLatitude, widget.initialLongitude),
zoom: 12,
);
}
@override
Widget build(BuildContext context) {
return GoogleMap(
mapType: MapType.normal,
initialCameraPosition: _initialCameraPosition,
markers: _markers,
onMapCreated: (GoogleMapController controller) {
_controller.complete(controller);
setState(
() {
_markers.addAll(widget.markers); <--------- This is the problem I think
_markers.add(
Marker(
markerId: const MarkerId('user-marker'),
position: LatLng(widget.initialLatitude, widget.initialLongitude),
),
);
},
);
},
);
}
}
正如我在代碼中指出的那樣，我認為問題在于，在子小部件內部，這些標記添加在onMapCreated屬性下。由于地圖已在第一個 中創建，因此FutureBuilder由于某種原因這些標記未添加到地圖中。我不知道如何從第二個FutureBuilder. 我添加的標記沒有通過。
有人可以幫忙嗎。我一直在努力尋找 6 個小時左右的方法，但未能成功。
uj5u.com熱心網友回復：
試試這個，改變你分配標記的行
markers: _markers
沿著這條線
markers: Set<Marker>.of(_markers.values),
uj5u.com熱心網友回復：
這可能會幫助你
bool mapToggle = false;
Position currentLocation;
GoogleMapController mapController;
GoogleMap googleMap;
var ads = [];
Map<MarkerId, Marker> markers = <MarkerId, Marker>{};
MarkerId selectedMarker;
LatLng markerPosition;
bool clientToggle = false;
@override
void initState() {
super.initState();
// GeolocationStatus geolocationStatus = await Geolocator.checkGeolocationPermissionStatus();
// Geolocator.checkPermission();
// Geolocator.getServiceStatusStream();
Geolocator.getCurrentPosition(desiredAccuracy: LocationAccuracy.high)
.then((currloc) {
setState(() {
currentLocation = currloc;
mapToggle = true;
populateClient();
});
});
}
@override
void dispose() {
super.dispose();
}
populateClient() {
kfirestore.collection('marks').get().then((value) {
if (value.docs.isNotEmpty) {
setState(() {
clientToggle = true;
});
for (int i = 0; i < value.docs.length; i ) {
ads.add(value.docs[i].data());
initMarker(value.docs[i].data(), value.docs[i].id);
var _distanceBetweenLastTwoLocations = Geolocator.distanceBetween(
value.docs[i].data()['location'].latitude,
value.docs[i].data()['location'].longitude,
currentLocation.latitude,
currentLocation.longitude,
);
print("bairshiluud:" _distanceBetweenLastTwoLocations.toString());
if (_distanceBetweenLastTwoLocations < 100) {
SuccessDialog(
title: "Таны байршилтай ойр сурталчилгаа",
titleColor: Colors.green,
description: value.docs[i].data()['adName'],
);
} else {
SuccessDialog(
title: "Таны байршилтай ойр сурталчилгаа",
titleColor: Colors.green,
description: "Таны байршилд ойр сурталчилгаа олдсонг?й.",
);
}
}
}
});
}
void initMarker(specify, specifyId) async {
var markerIdVal = specifyId;
final MarkerId markerId = MarkerId(markerIdVal);
final Marker marker = Marker(
markerId: markerId,
position: LatLng(
specify['location'].latitude,
specify['location'].longitude,
),
infoWindow: InfoWindow(title: specify['adName'], snippet: "Сурталчилгаа"),
icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRose),
);
setState(() {
markers[markerId] = marker;
});
}
Container(
height: MediaQuery.of(context).size.height - 80,
width: double.infinity,
child: mapToggle
? GoogleMap(
mapType: MapType.hybrid,
compassEnabled: true,
onMapCreated: onMapCreated,
buildingsEnabled: true,
myLocationButtonEnabled: true,
myLocationEnabled: true,
rotateGesturesEnabled: true,
zoomControlsEnabled: true,
zoomGesturesEnabled: true,
indoorViewEnabled: true,
mapToolbarEnabled: true,
tiltGesturesEnabled: true,
scrollGesturesEnabled: true,
initialCameraPosition: CameraPosition(
target: LatLng(currentLocation.latitude,
currentLocation.longitude),
zoom: 15,
),
// circles: circles,
markers: Set<Marker>.of(markers.values),
)
: Center(
child: Text("Loading"),
),
),
uj5u.com熱心網友回復：
1- 可能性不大，但也許您可以將標記：const [] 行更改為沒有 cons 關鍵字的 []。
2- 這比第一個更有可能，嘗試用其中一個覆寫未來的構建器，使用不同的小部件，如 SizedBox 或給其中一個唯一的鍵。（但我建議第一種方法，例如；條件？FutureBuilder:SizedBox(child: FutureBuilder)）因為，您的問題可能與小部件樹渲染有關。如果這解決了你的問題，我可以添加一個關于這個的 youtube 鏈接，你可以理解我想指出的意思。
3-對于相機位置，在相機創建函式呼叫后，在初始化googleMapsController的幫助下，您可以使用googleMapsController.animateCamera()函式更改相機位置，相機縮放和其他一些東西，
例子; googleMapsController.animateCamera(CameraUpdate.newLatLng(latLng)) 將谷歌地圖視圖更改為新的經緯度點。所以我建議，不要為此使用未來的構建器，只需在初始化后為您的相機設定影片，您可以在獲取位置之前使用 IgnorePointer 覆寫您的地圖小部件，這樣您就可以確保影片不會阻止用戶互動。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/382719.html
下一篇：Flutter三棵樹理解