A Flutter package for iOS and Android for showing passcode input screen, similar to Native iOS.
First add passcode_screen as a dependency in your pubspec.yaml file.
Then use import
import 'package:passcode_screen/passcode_screen.dart';
- Create a beautiful passcode lock view simply.
PasscodeScreen(
title: title,
passwordEnteredCallback: _onPasscodeEntered,
cancelLocalizedText: 'Cancel',
deleteLocalizedText: 'Delete',
shouldTriggerVerification: _verificationNotifier.stream,
);- Passcode input completed callback.
_onPasscodeEntered(String enteredPasscode) {
}- Notify passcode screen if passcode correct or not
final StreamController<bool> _verificationNotifier = StreamController<bool>.broadcast();
_onPasscodeEntered(String enteredPasscode) {
bool isValid = '123456' == enteredPassword;
_verificationNotifier.add(isValid);
}
Don't forget to close a stream
@override
void dispose() {
_verificationNotifier.close();
super.dispose();
}
- Customize UI.
Customize circles
class CircleUIConfig {
final Color borderColor;
final Color fillColor;
final double borderWidth;
final double circleSize;
double extraSize;
}Customize keyboard
class KeyboardUIConfig {
final double digitSize;
final TextStyle digitTextStyle;
final TextStyle deleteButtonTextStyle;
final Color primaryColor;
final Color digitFillColor;
final EdgeInsetsGeometry keyboardRowMargin;
final EdgeInsetsGeometry deleteButtonMargin;
}
Plugin is totally platform agnostic. No configuration required - the plugin should work out of the box.
Warmly welcome to submit a pull request!
Passcode Lock Screen is owned and maintained by Redeyes Dev
Vladimir Hudnitsky BeDaut mix1009
Basic implementation of a widget.
- You could show a widget, enter passcode and validate it.
- Added
isValidCallbackto help you handle success scenario.isValidCallbackwill be invoked after passcode screen will pop.
- Added configurable background and title color. (by @BeDaut)
- Added
cancelCallbackto react when user cancelled widget (by @mix1009)
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent