Flutter Authentication | Flutter Fingerprint Scanner | Local_Auth Package.

5 min readJul 6, 2021

Hi Guys , In this Flutter Tutorial we will demonstrate on how to implement flutter local authentication library to add fingerprint scanner or Face ID authentication to your android or iOS apps.

Introduction of Local Authentication Flutter library.

This local authentication flutter plugin, will help you to perform local, i.e on-device authentication of the user.

By using this library you can add Biometric authentication to login in your Android or iOS Application.

Flutter Authentication | Flutter Fingerprint Scanner | Local Authentication Package.

Step 1: Create new Flutter project

I am using VS Code as my IDE to build/develop Flutter Apps, you may you any of you favorite IDE like : IntelliJ IDEA, Android Studio.

In android Studio : File > New > New Flutter Project > Finish

Step 2: Adding Local authentication dependencies

Once your new flutter project is ready or you might have opened an existing flutter project. Now, on your left side of your IDE you may see your project structure, under that find pubspec.yaml file where you need to add the local authication dependencies.

Pubspec .yaml

dependencies:
  local_auth: ^0.4.0+1

Step 3: Adding USE_FINGERPRINT permission

USE_FINGERPRINT PERMISSION IN ANDROID

In your Flutter Project

android > app > src > main > AndroidManifest.xml

add the below permission

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.example.app">  <uses-permission android:name="android.permission.USE_FINGERPRINT"/>  <!-- add this line --><manifest>

USE_FINGERPRINT PERMISSION IN IOS

In your Flutter Project

ios > Runner > Info.plist

<key>NSFaceIDUsageDescription</key>
<string>Why is my app authenticating using face id?</string>

Step 4: Flutter Code

Main.dart

import 'package:local_auth/local_auth.dart';void main() {
  runApp(MyApp());
}class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(        primarySwatch: Colors.blue,        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: HomePageAuthCheck(),
    );
  }
}

HomePageAuthenticateCheck.dart

import 'package:flutter/cupertino.dart';
import 'package:local_auth/local_auth.dart';class HomePageAuthCheck extends StatefulWidget {
  @override
  _HomePageAuthCheckState createState() => _HomePageAuthCheckState();
}class _HomePageAuthCheckState extends State<HomePageAuthCheck> {
  //variable to check is biometric is there or not
  bool _hasBiometricSenson;  // list of finger print added in local device settings
  List<BiometricType> _availableBiomatrics;
  String  _isAuthorized = "NOT AUTHORIZED";
  LocalAuthentication authentication = LocalAuthentication();  //future function to check if biometric senson is available on device
  Future<void> _checkForBiometric() async{
    bool hasBiometric;    try{
      hasBiometric = await authentication.canCheckBiometrics;
    } on PlatformException catch(e)
    {
      print(e);
    }    if(!mounted) return;    setState(() {
      _hasBiometricSenson = hasBiometric;
    });
  }//future function to get the list of Biometric or faceID added into device
  Future<void> _getListofBiometric() async{
    List<BiometricType> ListofBiometric;    try{
      ListofBiometric = await authentication.getAvailableBiometrics();
    } on PlatformException catch(e)
    {
      print(e);
    }    if(!mounted) return;    setState(() {
      _availableBiomatrics  = ListofBiometric;
    });
  }  ////future function to check is the use is authorized or no
  Future<void> _getAuthentication() async{
    bool isAutherized = false;    try{
      isAutherized = await authentication.authenticateWithBiometrics(
          localizedReason: "SCAN YOUR FINGER PRINT TO GET AUTHORIZED",
          useErrorDialogs: true,
          stickyAuth: false
      );
    } on PlatformException catch(e)
    {
      print(e);
    }    if(!mounted) return;    setState(() {
     _isAuthorized = isAutherized ? "AUTHORIZED" : "NOT AUTHORIZED";
    });
  }  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter local Auth Package"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [            Text(" Is BioMetric Available ? : $_hasBiometricSenson"),
            RaisedButton(onPressed: (){
             _checkForBiometric();
            },color:Colors.blue,child: Text("Check",style: TextStyle(color: Colors.white),),),
            Text(" List of Available Biomatric LIST : $_availableBiomatrics"),
            RaisedButton(onPressed: (){
              _getListofBiometric();
            },color:Colors.blue,child: Text("Check List",style: TextStyle(color: Colors.white),),),
            Text(" Is AUTHORIED ? : $_isAuthorized"),
            RaisedButton(onPressed: (){
              _getAuthentication();
            },color:Colors.blue,child: Text("AUTH",style: TextStyle(color: Colors.white),),),
          ],
        ),
      ),
    );
  }
}

authentication With Biometrics has some more properties such as

localized Reason: Show a Text on the pop dialog box.

use Error Dialog: When set to true, will show a proper message on the dailog screen, weather your device have Available Biometric if not then in alert diaolog it will show a message to go to setting to set a new Fingerprint.

sticky Authentication: When set to true, whenever you app goes into background and then you return back to app again, the Authentication process will continue again.

Function Created in above to code to check the same

1. To check if device have biometric sensor or not

//future function to check if biometric sensor is available on device
  Future<void> _checkForBiometric() async{
    bool hasBiometric;    try{
      hasBiometric = await authentication.canCheckBiometrics;
    } on PlatformException catch(e)
    {
      print(e);
    }    if(!mounted) return;    setState(() {
      _hasBiometricSenson = hasBiometric;
    });
  }

This function will return true if device has biometric sensor else false.

2. To get the list of fingerprint added in your local device.

//future function to get the list of Biometric or faceID added into device
  Future<void> _getListofBiometric() async{
    List<BiometricType> ListofBiometric;    try{
      ListofBiometric = await authentication.getAvailableBiometrics();
    } on PlatformException catch(e)
    {
      print(e);
    }    if(!mounted) return;    setState(() {
      _availableBiomatrics  = ListofBiometric;
    });
  }

This will return array list of fingerprint

3. To check fingerprint authentication

////future function to check is the use is authorized or no
 Future<void> _getAuthentication() async{
   bool isAutherized = false;   try{
     isAutherized = await authentication.authenticateWithBiometrics(
         localizedReason: "SCAN YOUR FINGER PRINT TO GET AUTHORIZED",
         useErrorDialogs: true,
         stickyAuth: false
     );
   } on PlatformException catch(e)
   {
     print(e);
   }   if(!mounted) return;   setState(() {
    _isAuthorized = isAutherized ? "AUTHORIZED" : "NOT AUTHORIZED";
   });
 }