flutter display loading indicator during async function runs code example

Example: flutter show loading spinner when list loading

import 'dart:async';
  import 'package:flutter/material.dart';
  
  Future fetchStr() async {
    await new Future.delayed(const Duration(seconds: 5), () {});
    return 'Hello World';
  }
  
  void main() => runApp(MyApp(str: fetchStr()));
  
  class MyApp extends StatelessWidget {
    final Future str;
    MyApp({Key key, this.str}) : super(key: key);
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: 'Fetch Data Example',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: Scaffold(
          appBar: AppBar(
            title: Text('Fetch Data Example'),
          ),
          body: Center(
            child: FutureBuilder(
              future: str,
              builder: (context, snapshot) {
                if (snapshot.hasData) {
                  return Text(snapshot.data);
                } else if (snapshot.hasError) {
                  return Text("${snapshot.error}");
                }
                // By default, show a loading spinner
                return CircularProgressIndicator();
              },
            ),
          ),
        ),
      );
    }
  }