passcode_screen 1.2.0

Flutter Android iOS web

A platform agnostic Flutter package for showing passcode input screen, similar to Native iOS. Screen customizable with a colors, sizes, fonts etc.

Pub

Flutter - Passcode Lock Screen #

A Flutter package for iOS and Android for showing passcode input screen, similar to Native iOS.

passcode-screen-demo.gif

Installation #

First add passcode_screen as a dependency in your pubspec.yaml file.

Then use import

import 'package:passcode_screen/passcode_screen.dart';

What can it do for you? #

passcode-screen-default.png
  1. Create a beautiful passcode lock view simply.
PasscodeScreen(
  title: title,
  passwordEnteredCallback: _onPasscodeEntered,
  cancelLocalizedText: 'Cancel',
  deleteLocalizedText: 'Delete',
  shouldTriggerVerification: _verificationNotifier.stream,  
);
  1. Passcode input completed callback.
_onPasscodeEntered(String enteredPasscode) {
  
}
  1. 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();
}

  1. 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;
}
passcode-screen-custom.png

iOS & Android #

Plugin is totally platform agnostic. No configuration required - the plugin should work out of the box.

Contributions #

Warmly welcome to submit a pull request!

Passcode Lock Screen #

Passcode Lock Screen is owned and maintained by Redeyes Dev

Used in production #

Passkeep - Passwords Keeper

Contributors #

Vladimir Hudnitsky BeDaut mix1009 pixnbit

Relase notes: #

1.0.0+1: #

Basic implementation of a widget.

  • You could show a widget, enter passcode and validate it.

1.0.1 #

  • Added isValidCallback to help you handle success scenario. isValidCallback will be invoked after passcode screen will pop.

1.0.2 #

  • Added configurable background and title color. (by @BeDaut)
  • Added cancelCallback to react when user cancelled widget (by @mix1009)

1.1.0 #

  • Provide widget instead of string for title
  • Fixed digits layout
  • Added flexibility to configure 'Cancel' and 'Delete' buttons as widgets
  • Added flexibility to provide digits as list of strings for better customisation
  • Removed navigation as default action when cancel pressed

[1.1.1] #

  • Add landscape view for the passcode screen

[1.2.0] #

  • Add dynamic size for landscape view.
  • Moved 'Cancel' button to the bottom of the screen to align with iOS Native Passcode Screen style.
23
likes
85
pub points
89%
popularity

Publisher

redeyes.dev

A platform agnostic Flutter package for showing passcode input screen, similar to Native iOS. Screen customizable with a colors, sizes, fonts etc.

Repository (GitHub)
View/report issues

Documentation

API reference

License

Apache 2.0 (LICENSE)

Dependencies

flutter

More

Packages that depend on passcode_screen