Search code examples
androidiosflutterdartflutter-alertdialog

Customize The Native Alert dialog in flutter applicaton for iOS or Android for Face Id implementation


Below is the method to authenticate biometric access in flutter application which is successfully implemented. If the error happens it shows a alert dialog box as shown in the image in iOS application, I want to customize this alert dialog box, how can I do that?

AlertBox Image enter image description here

this alert dialog is only shown when useErrorDialogs is set to true as in the below code.

this is referred from Face Id Lock Implementation in Flutter

Future<void> _authenticateUser() async {
    bool isAuthenticated = false;
    try {
      isAuthenticated = await _localAuthentication.authenticateWithBiometrics(
        localizedReason:
            "Please authenticate to view your transaction overview",
        useErrorDialogs: true,
        stickyAuth: true,
      );
    } on PlatformException catch (e) {
      print(e);
    }

    if (!mounted) return;

    isAuthenticated
        ? print('User is authenticated!')
        : print('User is not authenticated.');

    if (isAuthenticated) {
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (context) => TransactionScreen(),
        ),
      );
    }
  }

Solution

  • You can't change it. For security reasons, the whole biometric authentication process is handled by iOS outside your app.