Mobile secure keyboard to prevent KeyLogger attack and screen capture.

pub package

Screenshots

AlphanumericNumeric

Getting started

To use this plugin, add flutter_secure_keyboard as a dependency in your pubspec.yaml file. For example:

dependencies:
  flutter_secure_keyboard: ^2.2.1

Examples

class WithSecureKeyboardExample extends StatefulWidget {
  @override
  _WithSecureKeyboardExampleState createState() => _WithSecureKeyboardExampleState();
}

class _WithSecureKeyboardExampleState extends State<WithSecureKeyboardExample> {
  final _secureKeyboardController = SecureKeyboardController();

  final _passwordEditor = TextEditingController();
  final _passwordTextFieldFocusNode = FocusNode();

  final _pinCodeEditor = TextEditingController();
  final _pinCodeTextFieldFocusNode = FocusNode();

  @override
  Widget build(BuildContext context) {
    // Set the WithSecureKeyboard widget as the top-level widget
    // in the build function so that the secure keyboard works properly.
    return WithSecureKeyboard(
      controller: _secureKeyboardController,
      child: Scaffold(
        appBar: AppBar(title: Text('with_secure_keyboard_example')),
        body: _buildContentView()
      ),
    );
  }

  Widget _buildContentView() {
    // We recommend using the ListView widget to prevent widget overflow.
    return ListView(
      padding: const EdgeInsets.all(8.0),
      children: [
        _buildPasswordTextField(),
        SizedBox(height: 12.0),
        _buildPinCodeTextField()
      ],
    );
  }

  Widget _buildPasswordTextField() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text('Password'),
        TextFormField(
          controller: _passwordEditor,
          focusNode: _passwordTextFieldFocusNode,
          // We recommended to set false to prevent the software keyboard from opening.
          enableInteractiveSelection: false,
          obscureText: true,
          onTap: () {
            _secureKeyboardController.show(
              type: SecureKeyboardType.ALPHA_NUMERIC,
              focusNode: _passwordTextFieldFocusNode,
              initText: _passwordEditor.text,
              hintText: 'password',
              // Use onCharCodesChanged to have text entered in real time.
              onCharCodesChanged: (List<int> charCodes) {
                _passwordEditor.text = String.fromCharCodes(charCodes);
              }
            );
          },
        ),
      ],
    );
  }

  Widget _buildPinCodeTextField() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text('PinCode'),
        TextFormField(
          controller: _pinCodeEditor,
          focusNode: _pinCodeTextFieldFocusNode,
          // We recommended to set false to prevent the software keyboard from opening.
          enableInteractiveSelection: false,
          obscureText: true,
          onTap: () {
            _secureKeyboardController.show(
              type: SecureKeyboardType.NUMERIC,
              focusNode: _pinCodeTextFieldFocusNode,
              initText: _pinCodeEditor.text,
              hintText: 'pinCode',
              // Use onDoneKeyPressed to allow text to be entered when you press the done key,
              // or to do something like encryption.
              onDoneKeyPressed: (List<int> charCodes) {
                _pinCodeEditor.text = String.fromCharCodes(charCodes);
              }
            );
          },
        ),
      ],
    );
  }
}

Package

  • WithSecureKeyboard - A widget that implements a secure keyboard with controller.
  • SecureKeyboardController - Controller to check or control the state of the secure keyboard.

Note: The parameters marked with an asterisk(*) are required.

WithSecureKeyboard

ParameterDescription
controller*Controller to control the secure keyboard.
child*A child widget with a secure keyboard.
keyboardHeightThe height of the keyboard.
Default value is 280.0.
keyRadiusThe radius of the keyboard key.
Default value is 4.0.
keySpacingThe spacing between keyboard keys.
Default value is 1.2.
keyInputMonitorPaddingThe padding of the key input monitor.
Default value is const EdgeInsets.only(left: 10.0, right: 5.0).
keyboardPaddingThe padding of the keyboard.
Default value is const EdgeInsets.symmetric(horizontal: 5.0).
backgroundColorThe background color of the keyboard.
Default value is const Color(0xFF0A0A0A).
stringKeyColorThe color of the string key(alphanumeric, numeric..).
Default value is const Color(0xFF313131).
actionKeyColorThe color of the action key(shift, backspace, clear..).
Default value is const Color(0xFF222222).
doneKeyColorThe color of the done key.
Default value is const Color(0xFF1C7CDC).
activatedKeyColorThe key color when the shift action key is activated. If the value is null, doneKeyColor is used.
keyTextStyleThe text style of the text inside the keyboard key.
Default value is const TextStyle(color: Colors.white, fontSize: 17.0, fontWeight: FontWeight.w500).
inputTextStyleThe text style of the text inside the key input monitor.
Default value is const TextStyle(color: Colors.white, fontSize: 17.0, fontWeight: FontWeight.w500).
screenCaptureDetectedAlertTitleSecurity Alert title, only works on iOS.
screenCaptureDetectedAlertMessageSecurity Alert message, only works on iOS
screenCaptureDetectedAlertActionTitleSecurity Alert actionTitle, only works on iOS.

SecureKeyboardController

FunctionDescription
isShowingWhether the secure keyboard is showing.
showShow secure keyboard.
hideHide secure keyboard.

SecureKeyboardController.show()

ParameterDescription
type*The type of the secure keyboard.
focusNodeThe FocusNode that will receive focus on.
initTextThe initial value of the input text.
hintTextThe hint text to display when the input text is empty.
inputTextLengthSymbolThe symbol to use when displaying the input text length.
doneKeyTextThe text of the done key.
clearKeyTextThe text of the clear key.
obscuringCharacterThe secure character to hide the input text.
Default value is .
maxLengthThe maximum length of text that can be entered.
alwaysCapsWhether to always display uppercase characters.
Default value is false.
obscureTextWhether to hide input text as secure characters.
Default value is true.
shuffleNumericKeyWhether to shuffle the position of the numeric keys.
Default value is true.
hideKeyInputMonitorWhether to hide the key input monitor.
Default value is false.
disableKeyBubbleWhether to disable the key bubble.
Default value is false.
onKeyPressedCalled when the key is pressed.
onCharCodesChangedCalled when the character codes changed.
onDoneKeyPressedCalled when the done key is pressed.
onCloseKeyPressedCalled when the close key is pressed.

Libraries

flutter_secure_keyboard