Search code examples
flutterlistviewstream-builder

Render a ListView.ListTile in a StreamBuilder


I have a Flutter app where I am trying to render a ListTile inside a StreamBuilder.

I am having this error when loading the app:

type 'Future<List>' is not a subtype of type 'List'

The neabyComp() function snippet:

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;
  }

This is the snippet of code of the StreamBuilder where the error is coming from:

Container(
            child: StreamBuilder(
              stream: nearbyComp(),
              builder: (BuildContext context, AsyncSnapshot snapshot) {
                if (snapshot.hasError) {
                  return Text('Something went wrong');
                }
                if (snapshot.connectionState == ConnectionState.waiting) {
                  return Text("Loading");
                }
                return Container(
                  child: new ListView(
                    children: snapshot.data.map((document) {
                      // Adding snapshot.data.map<Widget> also returns error "Future<List<Widget>> is not a subtype of type List<Widget>"
                      return new ListTile(
                        title: new Text(document['companyName']),
                        subtitle: new Image.network(document['url']),
                      );
                    }).toList(),
                  ),
                );
              },
            ),
          ),

Solution

  • If anyone comes to this problem, here is the solution provided by @pskink (Look for the comments on the code snippets):

    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; // In this line, add the * after yield
      }
    

    And the other part is here:

    Container(
                child: StreamBuilder(
                  stream: nearbyComp(),
                  builder: (BuildContext context, AsyncSnapshot snapshot) {
                    if (snapshot.hasError) {
                      return Text('Something went wrong');
                    }
                    if (snapshot.connectionState == ConnectionState.waiting) {
                      return Text("Loading");
                    }
                    return Container(
                      child: new ListView(
                        children: snapshot.data.map((document) {
                          // Add snapshot.data.map<Widget> 
                          return new ListTile(
                            title: new Text(document['companyName']),
                            subtitle: new Image.network(document['url']),
                          );
                        }).toList(),
                      ),
                    );
                  },
                ),
              ),