An alert dialog is not displayed at the widget load, why?

Question

In my application I am reading a qr code with the flutter_barcode_scanner package, and when reading a valid code it is supposed to show me an alert dialog saying that it is correct, otherwise, well, no. To implement this package, an example tells us that based on an action (such as pressing a button) start the scanning method, and save what is read in a variable. Thus:

Future<void> scanQr() async {
    try {
      final qrCode = await FlutterBarcodeScanner.scanBarcode(
          '#ffffff', 'Cancel', true, ScanMode.QR);
      if (!mounted) {
        return;
      }
      setState(() {
        this.qrCode = qrCode.isEmpty
            ? 'EMPTY'
            : qrCode == '-1'
                ? 'INVALID'
                : qrCode;
      });
    } on PlatformException {
      qrCode = 'fail';
    }
  }

We can see what the set state occupies in order to update the value. This in a variable that, as you can see, is called qrCode. Which in the example puts it in a text widget and it works fine. when reading something, it is updated.

So, what I want to do is a simple validation, and based on said validation, show an alertdialog saying if what was read in the qr is right or wrong. I have my validation in the same setstate, I ask if a certain part of the read string looks like what I want. Likewise, I have an int variable, which when updated in the set state, draws an alertdialog.

  Future<void> scanQr() async {
    try {
      final qrCode = await FlutterBarcodeScanner.scanBarcode(
          '#ffffff', 'Cancel', true, ScanMode.QR);
      if (!mounted) {
        return;
      }
      setState(() {
        this.qrCode = qrCode.isEmpty
            ? 'EMPTY'
            : qrCode == '-1'
                ? 'INVALID'
                : qrCode;
      });
      if (qrCode.substring(0, 2) == 'somepattern') {
        setState(() {
          value = 1;
        });
      } else {
        setState(() {
          value = 2;
        });
      }
      //saveContact(qrCode);
    } on PlatformException {
      qrCode = 'fail';
    }
  }

In the build method I have:

  String qrCode = '';
  int value = 0;
  @override
  Widget build(BuildContext context) {
    //Future(() async {
    (value == 1)
        ? alerta('Yeah', "This code are right!")
        : (value == 2)
            ? alerta(
                'Oh no!', 'An invalid qr code')
            : null;
    //});

    return Scaffold(...

As you can see, I even try it with a future to give it time to draw, but it doesn't show any alertDialog. The text widget with the each is displayed. Even, i print the value, and its right, prints 2 and 1 respectively; but the alert dialog is never showed

Why doesn't it draw my alert dialog? What am I doing wrong?

Answer 1

Instead of writing the alert dialog logic inside build method, you should have it in scanQR method

  Future<void> scanQr() async {
    try {
      final qrCode = await FlutterBarcodeScanner.scanBarcode(
          '#ffffff', 'Cancel', true, ScanMode.QR);
      if (!mounted) {
        return;
      }
      setState(() {
        this.qrCode = qrCode.isEmpty
            ? 'EMPTY'
            : qrCode == '-1'
                ? 'INVALID'
                : qrCode;
      });
      if (qrCode.substring(0, 2) == 'somepattern') {
        setState(() {
          value = 1;
          alerta('Yeah', "This code are right!");
        });
      } else {
        setState(() {
          value = 2;
          alerta(
                'Oh no!', 'An invalid qr code');
        });
      }
      //saveContact(qrCode);
    } on PlatformException {
      qrCode = 'fail';
    }
  }

Try this and let me know.