Home > Back-end >  I used alert dialog in my flutter sample but its not showing
I used alert dialog in my flutter sample but its not showing

Time:11-21

I set alert dialog in my sample apps login page . when i click this login button alert dialog is not poping

I want pop the alert dialog when username and password does not match

please help me to fix this

 showDialog(
      context: ctx,
      builder: (ctx1) {
        return AlertDialog(
          title: const Text('Error'),
          content: Text(_errorMessage),
          actions: [
            TextButton(
              onPressed: () {
                Navigator.of(ctx1).pop();
              },
              child: const Text('Close'),
            )
          ],
        );
      });

This is My Alert Dialog code is there any problem in This code

this is error is showing when i click login button

 import 'package:flutter/material.dart';

class ScreenLogin extends StatefulWidget {
  ScreenLogin({Key? key}) : super(key: key);

  @override
  State<ScreenLogin> createState() => _ScreenLoginState();
}

class _ScreenLoginState extends State<ScreenLogin> {
  final _usernameController = TextEditingController();

  final _passwordController = TextEditingController();

  bool _isDataMatched = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
      child: Padding(
        padding: const EdgeInsets.all(15.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            TextFormField(
              controller: _usernameController,
              decoration: InputDecoration(
                border:
                    OutlineInputBorder(borderRadius: BorderRadius.circular(6)),
                hintText: 'Username',
                // fillColor: Colors.white,
                // filled: true,
              ),
            ),
            const SizedBox(
              height: 20,
            ),
            TextFormField(
              controller: _passwordController,
              obscureText: true,
              decoration: InputDecoration(
                border:
                    OutlineInputBorder(borderRadius: BorderRadius.circular(6)),
                hintText: 'Password',
                // fillColor: Colors.white,
                // filled: true,
              ),
            ),
            const SizedBox(
              height: 20,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                // ignore: prefer_const_constructors
                Visibility(
                  visible: !_isDataMatched,
                  child: Text(
                    'Username Password DoesNot Match',
                    style: TextStyle(
                      color: Colors.red,
                    ),
                  ),
                ),
                ElevatedButton.icon(
                  onPressed: () {
                    checkLogin(context);
                  },
                  icon: const Icon(Icons.check),
                  label: const Text('Login'),
                ),
              ],
            ),
          ],
        ),
      ),
    ));
  }

  void checkLogin(BuildContext ctx) {
    final _username = _usernameController.text;
    final _password = _passwordController.text;

    if (_username == _password) {
      //Goto Home
    } else {
      // ignore: prefer_const_declarations
      final _errorMessage = "Username Password DoesNot Match";

      //Snackbar
      ScaffoldMessenger.of(ctx).showSnackBar(
        SnackBar(
          backgroundColor: Colors.red,
          behavior: SnackBarBehavior.floating,
          margin: const EdgeInsets.all(10),
          content: Text(_errorMessage),
          duration: const Duration(
            seconds: 10,
          ),
        ),
      );

      //Alert Dialog

      showDialog(
          context: ctx,
          builder: (ctx1) {
            return AlertDialog(
              title: const Text('Error'),
              content: Text(_errorMessage),
              actions: [
                TextButton(
                  onPressed: () {
                    Navigator.of(ctx1).pop();
                  },
                  child: const Text('Close'),
                )
              ],

this my login page full code
            );
          });

      //Show Text
        setState(() {
          _isDataMatched = false;
        });
    }
  }
}

CodePudding user response:

change ctx to context in showDialog function

CodePudding user response:

I have launched your code and I have not experienced this Issue. Everything works as it should do.

Are you using flutter stable channel ?

Anyway You are launching showDialog() method right after showing snackbar. I would try to wrap your show dialog method in PostFrame Callback :

    WidgetsBinding.instance!.addPostFrameCallback((_) {
  showDialog(
      context: context,
      builder: (ctx1) {
        return AlertDialog(
            title: const Text('Error'),
            content: Text(_errorMessage),
            actions: [
              TextButton(
                onPressed: () {
                  Navigator.of(ctx1).pop();
                },
                child: const Text('Close'),
              )
            ],

        );
      });
});
  • Related