dseparate_phone_number_input
This is an input box that automatically separates the phone number.
UI display
empty input | normal 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
property | description | default |
---|---|---|
isShowErrorState | whether to show error state | false |
isShowHelperText | whether to show helper text | false |
isShowInputBorder | whether to show input box border | true |
helperTextSyncErrorState | whether the Helper text is synchronized with the error state | false |
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"), )
-
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"), )
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.