Show loading while performing an operation in Flutter

In this example, I'm going to share the code which will help you to show a Loader icon when an operation is being performed.

![](https://fluttercentral.com/Uploads/f9cc4c0d-3c6c-48a8-b4e5-040a49643ba2.gifwidth="50%height="auto](

Below is an example code of how to Show loading while performing an operation in Flutter. Code from Main.dart file. In order to run this project locally, all you need to do is to create a Project and copy paste the below code to Lib\main.dart file.

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("$"); } // By default, show a loading spinner return CircularProgressIndicator(); }, ), ), ), ); } }

Hope this will be useful to you.

Thanks, Srikanth