dseparate_phone_number_input

This is an input box that automatically separates the phone number.

UI display

empty inputnormal input
empty inputnormal input

Usage

To use this plugin, add dseparate_phone_number_input as a dependency in your pubspec.yaml file.

available parameters

PhoneNumInput({
  Key? key,
  this.width,
  this.margin,
  this.hintText,
  this.hintStyle,
  this.helperText,
  this.helperStyle,
  this.style,
  this.clearBtn,
  this.clearBtnSize = defaultClearBtnSize,
  this.clearBtnMaxSize = defaultClearBtnMaxSize,
  this.inputBorderSideWidth = defaultInputBorderSideWidth,
  required this.controller,
  this.focusNode,
  this.onNumInputComplete,
  this.onChanged,
  this.textInputAction = TextInputAction.next,
  this.onEditingComplete,
  this.isShowErrorState = false,
  this.isShowHelperText = false,
  this.isShowInputBorder = true,
  this.helperTextSyncErrorState = false,
}) : super(key: key);

special field instructions

propertydescriptiondefault
isShowErrorStatewhether to show error statefalse
isShowHelperTextwhether to show helper textfalse
isShowInputBorderwhether to show input box bordertrue
helperTextSyncErrorStatewhether the Helper text is synchronized with the error statefalse

example

  • error input (helper text not sync)

    PhoneNumInput(
      helperText: "unregistered phone numbers automatically create accounts",
      controller: _phoneController,
      focusNode: _focusNode,
      isShowHelperText: true,
      isShowErrorState: true,
      onNumInputComplete: (result) => print("the phone number is entered"),
      onEditingComplete: () => print("complete editing"),
    )
    

    err not sync input

  • helper text sync error state

    PhoneNumInput(
      helperText: "the phone number entered was incorrect",
      controller: _phoneController,
      focusNode: _focusNode,
      isShowHelperText: true,
      isShowErrorState: true,
      helperTextSyncErrorState: true,
      onNumInputComplete: (result) => print("the phone number is entered"),
      onEditingComplete: () => print("complete editing"),
    )
    

    err input

Contributions

If you encounter any problem or the library is missing a feature feel free to open an issue. Feel free to fork, improve the package and make pull request.

License

MIT

Libraries

separate_phone_number_input