Getter "Snapshot" called on null with StreamBuilder in Flutter - asynchronous

Question

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 1

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.