Flutter Screen Lock

This Flutter plugin provides an feature for screen lock. Enter your passcode to unlock the screen. You can also use biometric authentication as an option.

Features

Any number of digits can be specified
You can change Cancel and Delete text
The UI expands and contracts according to the size of the device
You can disable cancellation
You can use biometrics
Biometrics can be displayed on first launch

Usage

You can easily lock the screen with the following code.
To unlock, enter correctString.

Simple

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

showLockScreen(
  context: context,
  correctString: '1234',
);

Change digits

Default 4 digits can be changed. Change the correctString accordingly.

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

showLockScreen(
  context: context,
  digits: 6,
  correctString: '123456',
);

Use local_auth

Specify canBiometric and biometricFunction. biometricFunction

Add local_auth processing to biometricFunction. See the following page for details.

https://pub.dev/packages/local_auth

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

showLockScreen(
  context: context,
  correctString: '1234',
  canBiometric: true,
  biometricFunction: (context) async {
    LocalAuthentication localAuth = LocalAuthentication();
    bool didAuthenticate =
        await localAuth.authenticateWithBiometrics(
            localizedReason:
                'Please authenticate to show account balance');
    if (didAuthenticate) {
      Navigator.of(context).maybePop();
    }
  },
);

Open biometric first

add option showBiometricFirst.

showLockScreen(
  context: context,
  correctString: '1234',
  canBiometric: true,
  showBiometricFirst: true,
  biometricFunction: (context) async {
    LocalAuthentication localAuth = LocalAuthentication();
    bool didAuthenticate =
        await localAuth.authenticateWithBiometrics(
            localizedReason:
                'Please authenticate to show account balance');
    if (didAuthenticate) {
      Navigator.of(context).maybePop();
    }
  },
);

Can't cancel

This is the case where you want to force authentication when the app is first launched.

showLockScreen(
  context: context,
  correctString: '1234',
  canCancel: false,
);

Customize text

You can change Cancel and Delete text. We recommend no more than 6 characters at this time.

showLockScreen(
  context: context,
  correctString: '1234',
  cancelText: 'Close',
  deleteText: 'Remove',
);

Verifycation passcode (v1.1.1)

use showConfirmPasscode function.

showConfirmPasscode(
  context: context,
  confirmTitle: 'This is the second input.',
  onCompleted: (context, verifyCode) {
    // verifyCode is verified passcode
    print(verifyCode);
    // Please close yourself
    Navigator.of(context).maybePop();
  },
)

Customize your style (v1.1.2)

use circleInputButtonConfig option.

showLockScreen(
  context: context,
  correctString: '1234',
  backgroundColor: Colors.grey.shade50,
  backgroundColorOpacity: 1,
  circleInputButtonConfig: CircleInputButtonConfig(
    textStyle: TextStyle(
      fontSize: MediaQuery.of(context).size.width * 0.1,
      color: Colors.white,
    ),
    backgroundColor: Colors.blue,
    backgroundOpacity: 0.5,
    shape: RoundedRectangleBorder(
      side: BorderSide(
        width: 1,
        color: Colors.blue,
        style: BorderStyle.solid,
      ),
    ),
  ),
)

Help

How to prevent the background from being transparent

Set the backgroundColorOpacity option to 1

akoua / flutter_screen_lock