我正在嘗試使用插件自定義標記在谷歌地圖上顯示,我讓它接近作業,但是當我希望它顯示所有標記時,它只顯示我模型中的一個標記。為什么firestore只顯示一個標記,我如何獲得完整串列以顯示所有標記而不是一個?
編輯 1:洗掉了舊的創建標記功能,該功能可以制作普通的谷歌地圖示記。現在剩下的就是功能代碼,它只顯示一個標記而不是整個串列。
編輯 2:在查看了下面的初始建議后,我意識到我收到了與他們的建議類似的錯誤訊息。
編輯 3:根據@Denzel 的建議,作業代碼位于底部
未處理的例外:setState() 回呼引數回傳了 Future。E/flutter (31835):_HomePageState#73fe9 上的 setState() 方法被呼叫了一個閉包或回傳 Future 的方法。也許它被標記為“異步”。E/flutter (31835):不是在 setState() 呼叫中執行異步作業,而是先執行作業(不更新小部件狀態),然后在 setState() 呼叫中同步更新狀態。
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:custom_marker/marker_icon.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter/material.dart';
import '../models/marker_collect_model.dart';
class CustomMarkies extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<CustomMarkies> {
Set<Marker> list = <Marker>{};
List<String> listDocuments = [];
Future<void> readDataFromFirebase() async {
FirebaseFirestore firestore = FirebaseFirestore.instance;
CollectionReference<Map<String, dynamic>> collectionReference =
firestore.collection('2022TABR');
collectionReference.snapshots().listen((event) {
List<DocumentSnapshot> snapshots = event.docs;
for (var map in snapshots) {
Map<String, dynamic> data =
map.data() as Map<String, dynamic>; // add this line
MarkerCollectModel model =
MarkerCollectModel.fromMap(data); // use data here
String nameDocument = map.id;
listDocuments.add(nameDocument);
setState(() async {
Random random = Random();
int i = random.nextInt(10000);
String idString = 'id$i';
list.add(Marker(
markerId: MarkerId(idString),
icon: await MarkerIcon.downloadResizePicture(
url: model.urlavatar!, imageSize: 250),
position: LatLng(model.lat!, model.lng!),
);
});
}
});
}
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: GoogleMap(
initialCameraPosition: CameraPosition(target: LatLng(45.4279, -123.6880), zoom: 3),
markers: list,
),
floatingActionButton: FloatingActionButton.extended(
label: FittedBox(child: Text('Add Markers')),
onPressed: () async {
readDataFromFirebase();
list.toSet();
setState(() {});
},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
);
}
}
作業代碼
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:custom_marker/marker_icon.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter/material.dart';
import '../models/marker_collect_model.dart';
class CustomMarkies extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<CustomMarkies> {
Set<Marker> list = <Marker>{};
List<String> listDocuments = [];
Future<void> readDataFromFirebase() async {
FirebaseFirestore firestore = FirebaseFirestore.instance;
CollectionReference<Map<String, dynamic>> collectionReference =
firestore.collection('2022TABR');
collectionReference.snapshots().listen((event) async {
List<DocumentSnapshot> snapshots = event.docs;
for (var map in snapshots) {
Map<String, dynamic> data =
map.data() as Map<String, dynamic>; // add this line
MarkerCollectModel model =
MarkerCollectModel.fromMap(data); // use data here
String nameDocument = map.id;
listDocuments.add(nameDocument);
list.add(Marker(
markerId: MarkerId(nameDocument),
icon: await MarkerIcon.downloadResizePicture(
url: model.urlavatar!, imageSize: 250),
position: LatLng(model.lat!, model.lng!),
));
}
});
}
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: GoogleMap(
initialCameraPosition: CameraPosition(target: LatLng(45.4279, -123.6880), zoom: 3),
markers: list,
),
floatingActionButton: FloatingActionButton.extended(
label: FittedBox(child: Text('Add Markers')),
onPressed: () async {
readDataFromFirebase();
list.toSet();
setState(() {});
},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
);
}
}
uj5u.com熱心網友回復:
class CustomMarkies extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<CustomMarkies> {
Set<Marker> list = <Marker>{};
List<String> listDocuments = [];
/// This [async] here covers for everything within the function,
/// You can use [await] anywhere you want to
/// [collectionReference.snapshots()] returns a [Stream], so you [listen] to it
/// There's no need for [await] because [Stream] handles real-time data
/// In essence, it would update all it's [listeners] about the new change and this change will take effect in your UI
Future<void> readDataFromFirebase() async {
FirebaseFirestore firestore = FirebaseFirestore.instance;
CollectionReference<Map<String, dynamic>> collectionReference =
firestore.collection('2022TABR');
collectionReference.snapshots().listen((event) {
for (var map in snapshots) {
Map<String, dynamic> data =
map.data() as Map<String, dynamic>; // add this line
MarkerCollectModel model =
MarkerCollectModel.fromMap(data); // use data here
String nameDocument = map.id;
listDocuments.add(nameDocument);
list.add(Marker(
markerId: MarkerId(nameDocument),
icon: await MarkerIcon.downloadResizePicture(
url: model.urlavatar!, imageSize: 250),
position: LatLng(model.lat!, model.lng!),
));
}
});
}
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: GoogleMap(
initialCameraPosition:
CameraPosition(target: LatLng(45.4279, -123.6880), zoom: 3),
markers: list,
),
floatingActionButton: FloatingActionButton.extended(
label: FittedBox(child: Text('Add Markers')),
onPressed: () async {
// you have to `await readDataFromFirebase()` because it is a future.
await readDataFromFirebase();
list.toSet();
setState(() {});
},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
);
}
}
我發表評論以進一步解釋我的意思
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/478456.html
上一篇:如果應用程式在前臺,如何使用Geolocator更新用戶位置?
下一篇:如何在顫振上使用導航器
