Flutter屏幕锁定认证插件auth_screen_lock的使用

Flutter插件auth_screen_lock提供了屏幕锁定的功能。通过输入密码可以解锁屏幕，还可以选择性地使用生物识别认证。

功能展示

竖屏视图

横屏视图

特性

• 支持指定密码长度
• 可以更改“取消”和“删除”按钮的样式
• 根据设备大小和方向优化UI
• 可禁用取消功能
• 支持生物识别（依赖local_auth插件）
• 生物识别可以在首次启动时显示
• 提供解锁回调
• 可自定义密码不匹配事件
• 可限制最大重试次数

使用方法

简单示例

如果输入的密码与correctString相同，则自动关闭屏幕。

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

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

阻止用户取消

提供一个无法取消的屏幕锁。

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

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

创建密码

允许用户创建新密码并进行确认。

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

screenLockCreate(
  context: context,
  onConfirmed: (value) => print(value), // 在此处存储新密码
);

控制创建状态

import 'package:flutter_screen_lock/flutter_screen_lock.dart';

final inputController = InputController();

screenLockCreate(
  context: context,
  inputController: inputController,
);

// 在其他地方...
inputController.unsetConfirmed(); // 重置并重新确认输入

使用生物识别

在pubspec.yaml中添加local_auth包。

它包括一个示例，在didOpened中调用生物识别。

import 'package:flutter_screen_lock/flutter_screen_lock.dart';
import 'package:local_auth/local_auth.dart';
import 'package:flutter/material.dart';

Future<void> localAuth(BuildContext context) async {
  final localAuth = LocalAuthentication();
  final didAuthenticate = await localAuth.authenticateWithBiometrics(
      localizedReason: '请进行身份验证');
  if (didAuthenticate) {
    Navigator.pop(context);
  }
}

screenLock(
  context: context,
  correctString: '1234',
  customizedButtonChild: Icon(Icons.fingerprint),
  customizedButtonTap: () async => await localAuth(context),
  didOpened: () async => await localAuth(context),
);

完全自定义

你可以自定义屏幕锁的各个方面。以下是一个示例：

import 'package:flutter/material.dart';
import 'package:flutter_screen_lock/flutter_screen_lock.dart';

screenLockCreate(
  context: context,
  title: const Text('更改标题'),
  confirmTitle: const Text('更改确认标题'),
  onConfirmed: (value) => Navigator.of(context).pop(),
  config: const ScreenLockConfig(
    backgroundColor: Colors.deepOrange,
  ),
  secretsConfig: SecretsConfig(
    spacing: 15, // 或使用 spacingRatio
    padding: const EdgeInsets.all(40),
    secretConfig: SecretConfig(
      borderColor: Colors.amber,
      borderSize: 2.0,
      disabledColor: Colors.black,
      enabledColor: Colors.amber,
      height: 15,
      width: 15,
      build: (context,
              {required config, required enabled}) =>
          Container(
        decoration: BoxDecoration(
          shape: BoxShape.rectangle,
          color: enabled
              ? config.enabledColor
              : config.disabledColor,
          border: Border.all(
            width: config.borderSize,
            color: config.borderColor,
          ),
        ),
        padding: const EdgeInsets.all(10),
        width: config.width,
        height: config.height,
      ),
    ),
  ),
  keyPadConfig: KeyPadConfig(
    buttonConfig: StyledInputConfig(
      textStyle:
          StyledInputConfig.getDefaultTextStyle(context)
              .copyWith(
        color: Colors.orange,
        fontWeight: FontWeight.bold,
      ),
      buttonStyle: OutlinedButton.styleFrom(
        shape: const RoundedRectangleBorder(),
        backgroundColor: Colors.deepOrange,
      ),
    ),
    displayStrings: [
      '零',
      '壱',
      '弐',
      '参',
      '肆',
      '伍',
      '陸',
      '質',
      '捌',
      '玖'
    ],
  ),
  cancelButton: const Icon(Icons.close),
  deleteButton: const Icon(Icons.delete),
);

版本迁移

8.x 到 9 迁移

• 将参数screenLockConfig更改为config
• 将参数keyPadConfig更改为config

7.x 到 8 迁移

• 将所有回调名称从didSomething更改为onSomething
• 将screenLock中的confirm: true更改为screenLockCreate
• 将ScreenLock中的confirm: true更改为ScreenLock.create
• 替换StyledInputConfig为KeyPadButtonConfig
• 替换spacingRatio为固定值spacing在Secrets中

6.x 到 7 迁移

• 需要dart >= 2.17 和 Flutter 3.0
• 替换InputButtonConfig为KeyPadConfig
• 将delayChild更改为delayBuilder。delayBuilder不再显示在一个新屏幕上，而是位于Secrets上方。
• 在secretsBuilder中接受BuildContext

5.x 到 6 迁移

• ScreenLock不再内部使用Navigator.pop。开发者应在需要时手动弹出。
• 如果onUnlocked为null，screenLock调用将自动弹出。

4.x 到 5 迁移

• 导入名称已更改：

  import 'package:flutter_screen_lock/functions.dart';

  更改为：

  import 'package:flutter_screen_lock/flutter_screen_lock.dart';