Bloccare la UI in Flutter con block_ui

block_ui è una libreria per Flutter che ci consente di bloccare la UI fino ad operazione compiuta.

Può essere molto comodo in tutti quei casi in cui dobbiamo svolgere delle operazioni durante le quali vogliamo bloccare l'interazione con l'utente.

Per il codice qui sotto dovremmo installare anche flutter_spinkit, ma non è obbligatorio in generale:

flutter pub add block_ui flutter_spinkit

Qui sotto un esempio (vi riporto solo il minimo indispensabile):

ElevatedButton(
  onPressed: () async {
    BlockUi.show(
      context,
      child: SpinKitChasingDots(
        color: Color(0xff388e3c),
      ),
    );
    // DO STUFF
    await Future.delayed(Duration(milliseconds: 1000));
    BlockUi.hide(context);
  },
  child: Text('Premi'),
),

Oppure possiamo anche inserire un colore di sfondo:

ElevatedButton(
  onPressed: () async {
    BlockUi.show(
      context,
      backgroundColor: Colors.green,
      child: SpinKitChasingDots(
        color: Color(0xff388e3c),
      ),
    );
    await Future.delayed(Duration(milliseconds: 1000));
    BlockUi.hide(context);
  },
  child: Text('Premi'),
),

Enjoy!