如何使用 Flutter 按设备半径内的位置显示附近集合的 Firebase Firestore 集合 [英] How to show Firebase firestore colletions of nearby collections by location inside a radius of the device using Flutter

问题描述

我正在使用 Flutter 开发一个应用程序，例如送餐应用程序.所以我有餐厅应用程序和最终用户应用程序.

I am developing an App using Flutter, like a food delivery app. So I have the restaurant app, and the end-user app.

我现在在做什么

获取公司地址 (geoLocation)，并使用带有 geohash 的 lat 和 lng 将位置存储在餐厅的 Firestore 集合中.对于最终用户应用，我正在获取当前设备位置.

Getting the company address (geoLocation), and using lat and lng with geohash to store the location on the Firestore collection for the Restaurants. And for the end-user app, I am getting the current device location.

我正在努力实现的目标

在最终用户应用上，我想创建一个列表，例如 uber Eats，使用最终用户设备的当前位置以及我们 Firestore 上的餐厅位置来显示附近的餐馆.

On the end-user app, I want to create a list, like uber eats, to show the nearby restaurants, using the current location of the end-user device, with the Restaurant location on our Firestore.

我正在使用 GeoFlutterFire 依赖项来获取位置.

I am using GeoFlutterFire dependencie to achieve the locations.

我的功能

Stream nearbyComp() async* {
    var pos = await location.getLocation();

    GeoFirePoint point =
        geo.point(latitude: pos.latitude, longitude: pos.longitude);
    final CollectionReference users =
        _firebaseFirestore.collection("Companies");

    double radius = 10;
    String field = 'location';

    Stream<List<DocumentSnapshot>> stream = geo
        .collection(collectionRef: users)
        .within(center: point, radius: radius, field: field, strictMode: true);

    yield stream;
  }

我要在哪里显示列表

Container(
            child: StreamBuilder(
              stream: nearbyComp(),
              builder: (context, snapshot) {
                if (!snapshot.hasData) {
                  return Text("Loading");
                }
                return Container(
                  child: Text("companyName"), // This needs to be changed to a list? Display company name, image, etc, here.
                );
              },
            ),
          ),

当前问题

问题是，我找不到在最终用户屏幕上显示餐厅资料的方法，例如图像、名称等.我想我需要一个 ListView.Builder，但不知道该怎么做它与 nearComp() 函数上的 Stream 一起使用.

The issue is, I can't find a way to display the Restaurant Profile on the end-user screen, like image, name, etc. I think I need a ListView.Builder, but don't know how to do it with the Stream on the nearComp() function.

我的 Firestore

推荐答案

在你的streambuilder的回报:

In your streambuilder's return:

return ListView(children: [
for (var item in snapshot.data) 
  ListTile( title: Text ( item["companyEmail"])) 
// Or use item.data()["companyEmail"], I didn't work with //geoFire, but these should work since it's firebase.
])

这篇关于如何使用 Flutter 按设备半径内的位置显示附近集合的 Firebase Firestore 集合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！