Can't load Json file in flutter application anymore - json

Question

I created an language learning app, where the user can choose from various topics inside a language (f.e shopping, smalltalk, alphabet, consonants and so on). When the user taps a topic it will load a json file. The app worked totally fine and is already on the app store (it's called Sankofa). Now I wanted to add a new language and noticed that my Futurebuilder doesn't work anymore, thus the app won't load the json file.
The error I got is:
The following _TypeError was thrown building FutureBuilder(dirty, state: _FutureBuilderState#a072a):
type 'Null' is not a subtype of type 'List'
Here's the code that loads the json file:
class Json extends StatelessWidget {
// accepting language as a parameter
String topicname;
late String assettoload;
Json(this.topicname);
setasset() {
if (topicname == "farben") {
assettoload = "assets/lerndateien/farben.json";
} else if (topicname == "Fragewörter") {
assettoload = "assets/lerndateien/fragewoerter.json";
} else if (topicname == "Begrüßungen") {
assettoload = "assets/lerndateien/saetze.json";
} else if (topicname == "Konsonanten") {
assettoload = "assets/lerndateien/konsonanten.json";
} else if (topicname == "Selbstlaute") {
assettoload = "assets/lerndateien/selbstlaute.json";
} else if (topicname == "Wochentage") {
assettoload = "assets/lerndateien/wochentage.json";
} else if (topicname == "Zeitangaben") {
assettoload = "assets/lerndateien/zeitangaben.json";
} else if (topicname == "Einkaufen") {
assettoload = "assets/lerndateien/einkaufen.json";
} else if (topicname == "Konversation") {
assettoload = "assets/lerndateien/konversation.json";
} else if (topicname == "Richtungen") {
assettoload = "assets/lerndateien/richtungsangaben.json";
} else if (topicname == "Über mich") {
assettoload = "assets/lerndateien/uebermich.json";
} else if (topicname == "Wegweisung") {
assettoload = "assets/lerndateien/wegweisungen.json";
} else if (topicname == "Lebensmittel") {
assettoload = "assets/lerndateien/lebensmittel.json";
} else if (topicname == "Tiere") {
assettoload = "assets/lerndateien/tiere.json";
}
}
#override
Widget build(BuildContext context) {
// function called before the build
// string assettoload is avialable to the DefaultAssetBuilder
setasset();
// return to the FutureBuilder to load and decode JSON
return FutureBuilder(
future:
DefaultAssetBundle.of(context).loadString(assettoload, cache: false),
builder: (context, snapshot) {
List mydata = json.decode(snapshot.data.toString());
if (mydata == null) {
return Scaffold(
body: Row(
children: [
BackButton(),
Center(
child: Text(
"Lädt...",
),
),
],
),
);
} else {
return quizpage(mydata: mydata);
}
},
);
}
}
I tried a lot of things (f.e if mydata == true) but nothing worked. I bet it's just a small fix and I hope that someone can help me.
Thanks!

Answer 1

That is because you're trying to access the snapshots data when it hasn't finished loading yet (no matter if it will be null or not) by using toString().
Inside your Builder you need to handle the case while it is loading, before you can check if it loaded null.
builder: (context, snapshot) {
// This will execute when it is finished loading AND is not null
if(snapshot.hasData){
List mydata = json.decode(snapshot.data.toString());
if (mydata == null) {
return Scaffold(
body: Row(
children: [
BackButton(),
Center(
child: Text(
"Lädt...",
),
),
],
),
);
} else {
return quizpage(mydata: mydata);
}
}
/* other handling, example */
return CircularProgressIndicator();
},
...
Now, as you'll see in your IDE, the snapshot can have multiple ConnectionStates. See here for a decent example of how to handle other states.