Circular loading before page loads Flutter - flutter

Question

I have a list of widgets and a function which returns a Container telling user to add to the list if the list of widgets is empty:
_isCountEmpty() {
if (count == 0 || count == null) {
//if no widgets in list
return Container(
color: Colors.black,
child: Text('Press edit to start adding exercises',
style: TextStyle(
fontSize: 40,
color: Colors.white,
)));
}
//if widgets in list
return ListView(
children: children,
scrollDirection: Axis.vertical,
);
}
initState where count is obtained:
void initState() {
getCount().then(updateCount);
super.initState(); }
The count value is received from another page using shared preferences which are called in my initState. Before the count value is received in the initState the screen thinks the value for count is null therefore for just a split second the Container() is returned just before the ListView.
Instead of this, I want the circular indicator to show while the screen is getting the value of count from initState, and then return the Container or ListView after the value for count is obtained
Thank you

Answer 1

You can try the following code which would load your counter from shared preferences then you can replace the Text widget with whatever list you want or container if the counter == 0 || counter == null
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
int counter;
Future<SharedPreferences> prefs;
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder(
future: prefs,
builder: (context, AsyncSnapshot<SharedPreferences> snapshot) {
if (!snapshot.hasData) {
return CircularProgressIndicator();
} else {
counter = snapshot.data.getInt("counter");
//Replace with whatever widget you want
return Text("Loading is done your counter is : $counter");
}
},
)),
);
}
#override
void initState() {
super.initState();
prefs = SharedPreferences.getInstance();
}
}