Charles Jr Charles Jr - 9 months ago 98
Dart Question

Getter "Snapshot" called on null with StreamBuilder in Flutter

I'm using a Flutter Streambuilder and my stream calls null for a second before it loads. I'm trying to load a "Loading..." Card but its not working. My simulator briefly shows a red error screen before displaying my desired card list. How can I get it to stop doing this? Here is my code...

new Expanded(
child: new StreamBuilder(
stream: streamQuery,
builder:
(BuildContext context, AsyncSnapshot<Event> event) {
if (event.data.snapshot.value == null) {
return new Card(
child: new Text('Loading...',
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.bold,
fontStyle: FontStyle.italic)),
);
}

Map myMap = event.data.snapshot.value; //store each map
var titles = myMap.values;

List onesTitles = new List();
List onesIds = new List();
List onesImages = new List();
List onesRank = new List();

for (var items in titles) {
onesTitles.add(items['vidTitle']);
onesIds.add(items['vidId']);
onesImages.add(items['vidImage']);
onesRank.add(items['Value']);
}

names = onesTitles;
ids = onesIds;
numbers = onesRank;
vidImages = onesImages;

switch (event.connectionState) {
case ConnectionState.none:
return new Card(
child: new Text('Loading...',
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.bold,
fontStyle: FontStyle.italic)),
);
case ConnectionState.waiting:
return new Card(
child: new Text('Awaiting Results...',
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.bold,
fontStyle: FontStyle.italic)),
);
default:
if (event.hasError)
return new Card(
child: new Text('Error: ${event.error}',
style: new TextStyle(
fontSize: 12.0,
fontWeight: FontWeight.bold,
fontStyle: FontStyle.italic)),
);
else
return new InkWell(

Answer Source

You need to explicitly state all your data manipulation inside the else that has the build layout for your if (snapshot!=null) {//do something}

Something like this:

else //event.data.snapshot.value != null
 { 
Map myMap = event.data.snapshot.value; //store each map
                        var titles = myMap.values;

                        List onesTitles = new List();
                        List onesIds = new List();
                        List onesImages = new List();
                        List onesRank = new List();

                        for (var items in titles) {
                          onesTitles.add(items['vidTitle']);
                          onesIds.add(items['vidId']);
                          onesImages.add(items['vidImage']);
                          onesRank.add(items['Value']);
                        }

                        names = onesTitles;
                        ids = onesIds;
                        numbers = onesRank;
                        vidImages = onesImages;

//return my layout 
}

So do no leave anything that is using your snapshot.value outside your if statement that works when snapshot!=null.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download