'how to prevent rflutter_alert from closing when clicked outside

ive basically got an rflutter alert that looks like this

Alert(
      context: context,
      title: "GAME OVER",
      desc: "Youve got $correct/13, try again?",
      buttons: [
        DialogButton(
          child: Text(
            "COOL",
            style: TextStyle(color: Colors.white, fontSize: 20),
          ),
          onPressed: () => restart(),
          width: 120,
        )
      ],
    ).show();

but when i click on the area outside of the alert, it closes the alert. how do i make it such that the alert wont close when clicked outside?

i tried using "barrierDismissible" but got an error. perhaps is it even possible to make the alert not close when using the rflutter_alert package?

thank you

(i just started learning flutter and the class used rflutter_alert thats why im using it, is there a "best" way to present alerts?)



Solution 1:[1]

enter image description here

add barrierDismissible: false in showdialog default is true

   showDialog<String>(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext context) => AlertDialog(

        title: const Text('AlertDialog Title'),
        content: const Text('AlertDialog description'),
        actions: <Widget>[
          TextButton(
            onPressed: () => Navigator.pop(context, 'Cancel'),
            child: const Text('Cancel'),
          ),
          TextButton(
            onPressed: () => Navigator.pop(context, 'OK'),
            child: const Text('OK'),
          ),
        ],
      ),
    );

SampleCode

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: const Center(
          child: MyStatelessWidget(),
        ),
      ),
    );
  }
}

class MyStatelessWidget extends StatelessWidget {
  const MyStatelessWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TextButton(
      onPressed: () => showDialog<String>(
        context: context,
        barrierDismissible: false,
        builder: (BuildContext context) => AlertDialog(
          title: const Text('AlertDialog Title'),
          content: const Text('AlertDialog description'),
          actions: <Widget>[
            TextButton(
              onPressed: () => Navigator.pop(context, 'Cancel'),
              child: const Text('Cancel'),
            ),
            TextButton(
              onPressed: () => Navigator.pop(context, 'OK'),
              child: const Text('OK'),
            ),
          ],
        ),
      ),
      child: const Text('Show Dialog'),
    );
  }
}

Solution 2:[2]

Add this line to your code.

style: AlertStyle(isOverlayTapDismiss: false),

Full code then :

Alert(
  context: context,
  style: AlertStyle(isOverlayTapDismiss: false),
  title: "GAME OVER",
  desc: "Youve got $correct/13, try again?",
  buttons: [
    DialogButton(
      child: Text(
        "COOL",
        style: TextStyle(color: Colors.white, fontSize: 20),
      ),
      onPressed: () => restart(),
      width: 120,
    )
  ],
).show();

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 lava
Solution 2 muhibbin_munna