mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
feat(text): valueFormatter for easy and flexible input auto-formatting (#10264)
https://github.com/NativeScript/NativeScript/issues/10249
This commit is contained in:
@@ -21,6 +21,7 @@ export abstract class EditableTextBase extends TextBase implements EditableTextB
|
||||
public autocorrect: boolean;
|
||||
public hint: string;
|
||||
public maxLength: number;
|
||||
public valueFormatter: (value: string) => string;
|
||||
|
||||
public abstract dismissSoftInput();
|
||||
public abstract _setInputType(inputType: number): void;
|
||||
|
||||
@@ -493,6 +493,10 @@ export abstract class EditableTextBase extends EditableTextBaseCommon {
|
||||
|
||||
public onTextChanged(text: string, start: number, before: number, count: number): void {
|
||||
// called by android.text.TextWatcher
|
||||
if (this.valueFormatter) {
|
||||
this.text = this.valueFormatter(text.toString());
|
||||
this.android.setSelection((this.text || '').length);
|
||||
}
|
||||
// const owner = this.owner;
|
||||
// let selectionStart = owner.android.getSelectionStart();
|
||||
// owner.android.removeTextChangedListener(owner._editTextListeners);
|
||||
|
||||
@@ -36,7 +36,7 @@ export class EditableTextBase extends TextBase {
|
||||
/**
|
||||
* Gets or sets the autofill type.
|
||||
*/
|
||||
autofillType: CoreTypes.AutofillType;
|
||||
autofillType: CoreTypes.AutofillType;
|
||||
|
||||
/**
|
||||
* Gets or sets whether the instance is editable.
|
||||
@@ -58,6 +58,12 @@ export class EditableTextBase extends TextBase {
|
||||
*/
|
||||
maxLength: number;
|
||||
|
||||
/**
|
||||
* Format input values
|
||||
* Note: useful for input masking/formatting
|
||||
*/
|
||||
valueFormatter: (value: string) => string;
|
||||
|
||||
/**
|
||||
* Hides the soft input method, ususally a soft keyboard.
|
||||
*/
|
||||
|
||||
@@ -190,16 +190,31 @@ export class TextField extends TextFieldBase {
|
||||
}
|
||||
|
||||
if (this.updateTextTrigger === 'textChanged') {
|
||||
// 1. secureTextEntry with firstEdit should not replace
|
||||
// 2. emoji's should not replace value
|
||||
// 3. convenient keyboard shortcuts should not replace value (eg, '.com')
|
||||
const shouldReplaceString = (textField.secureTextEntry && this.firstEdit) || (delta > 1 && !isEmoji(replacementString) && delta !== replacementString.length);
|
||||
if (shouldReplaceString) {
|
||||
textProperty.nativeValueChange(this, replacementString);
|
||||
if (this.valueFormatter) {
|
||||
// format/replace
|
||||
let currentValue = textField.text;
|
||||
let nativeValueChange = `${textField.text}${replacementString}`;
|
||||
if (replacementString === '') {
|
||||
// clearing when empty
|
||||
nativeValueChange = currentValue.slice(0, delta);
|
||||
}
|
||||
|
||||
const formattedValue = this.valueFormatter(nativeValueChange);
|
||||
textField.text = formattedValue;
|
||||
textProperty.nativeValueChange(this, formattedValue);
|
||||
return false;
|
||||
} else {
|
||||
if (range.location <= textField.text.length) {
|
||||
const newText = NSString.stringWithString(textField.text).stringByReplacingCharactersInRangeWithString(range, replacementString);
|
||||
textProperty.nativeValueChange(this, newText);
|
||||
// 1. secureTextEntry with firstEdit should not replace
|
||||
// 2. emoji's should not replace value
|
||||
// 3. convenient keyboard shortcuts should not replace value (eg, '.com')
|
||||
const shouldReplaceString = (textField.secureTextEntry && this.firstEdit) || (delta > 1 && !isEmoji(replacementString) && delta !== replacementString.length);
|
||||
if (shouldReplaceString) {
|
||||
textProperty.nativeValueChange(this, replacementString);
|
||||
} else {
|
||||
if (range.location <= textField.text.length) {
|
||||
const newText = NSString.stringWithString(textField.text).stringByReplacingCharactersInRangeWithString(range, replacementString);
|
||||
textProperty.nativeValueChange(this, newText);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user