Katana Indicator

---

[YouTube](https://www.youtube.com/c/mathrunetchannel) | [Packages](https://pub.dev/publishers/mathru.net/packages) | [Twitter](https://twitter.com/mathru) | [LinkedIn](https://www.linkedin.com/in/mathrunet/)

---

Introduction

When developing applications, it is often necessary to write processes that take some time, such as saving data or logging in on a button onPressed.

Basically, you would have the user wait with an indicator until the process is complete, and then display a dialog or return to the screen when it is complete.

I have created a package that makes it easy to describe the process for this purpose.

Assume that all processes to be executed wait on Future.

It can be easily written as follows

final future = repository.save(); // Some kind of storage process (return Future<dynamic>)
await future.showIndicator(context); // Displays an indicator and does not allow the user to operate until the process is completed
// Show Dialog

katana_model allows all CRUD operations to wait in Future, so the saving process can be written in a concise manner.

IconButton(
  icon: Icon(Icons.check),
  onPressed: () async {
    final doc = collection.create();
    await doc.save({
      "first": "masaru",
      "last": "hirose",
      "type": "kanimiso",
    }).showIndicator(context);
    context.router.pop();
  }
);

Installation

Import the following packages

flutter pub add katana_indicator

How to use

Basically, you just use the extension methods provided by Future.

final doc = collection.create();
await doc.save({
  "first": "masaru",
  "last": "hirose",
  "type": "kanimiso",
}).showIndicator(context);
context.router.pop();

The indicator CircularProgressIndicator is used by default.

If you wish to change this, use the indicator parameter of showIndicator.

await doc.save({
  "first": "masaru",
  "last": "hirose",
  "type": "kanimiso",
}).showIndicator(context, indicator: Center(child: LinearProgressIndicator()));