用于 iOS 和 Android 显示密码输入屏幕的 Flutter 包

Flutter - 密码锁定屏幕

用于 iOS 和 Android 显示密码输入屏幕的 Flutter 包，类似于原生 iOS。

安装

首先，将passcode_screen添加为pubspec.yaml文件中的依赖项。

然后使用导入

import 'package:passcode_screen/passcode_screen.dart';

它能为你做什么？

1. 简单地创建一个漂亮的密码输入视图。

PasscodeScreen(
  title: title,
  passwordEnteredCallback: _onPasscodeEntered,
  cancelLocalizedText: 'Cancel',
  deleteLocalizedText: 'Delete',
  shouldTriggerVerification: _verificationNotifier.stream,  
);

2. 密码输入完成回调。

_onPasscodeEntered(String enteredPasscode) {
  
}

3. 通知密码屏幕密码是否正确

final StreamController<bool> _verificationNotifier = StreamController<bool>.broadcast();

_onPasscodeEntered(String enteredPasscode) {
  bool isValid = '123456' == enteredPassword;
  _verificationNotifier.add(isValid);
}

别忘了关闭流

@override
void dispose() {
  _verificationNotifier.close();
  super.dispose();
}

4. 自定义UI。

自定义圆圈

class CircleUIConfig {
  final Color borderColor;
  final Color fillColor;
  final double borderWidth;
  final double circleSize;
  double extraSize;
}

自定义键盘

class KeyboardUIConfig {
  final double digitSize;
  final TextStyle digitTextStyle;
  final TextStyle deleteButtonTextStyle;
  final Color primaryColor;
  final Color digitFillColor;
  final EdgeInsetsGeometry keyboardRowMargin;
  final EdgeInsetsGeometry deleteButtonMargin;
}

iOS 和 Android

插件完全是平台无关的。无需配置 - 该插件应开箱即用。

GitHub

https://github.com/xPutnikx/flutter-passcode