From cc449b394e9cd3300343016a5d6a3c924823cd2b Mon Sep 17 00:00:00 2001 From: Andrei Coman Date: Thu, 7 Jan 2016 13:39:27 -0800 Subject: [PATCH] Refactor text input keyboards Reviewed By: foghina Differential Revision: D2807491 fb-gh-sync-id: e7e5fb8c235f3637f619b2f44053749c51f379f0 --- Libraries/Components/TextInput/TextInput.js | 7 ++- .../uimanager/UIManagerModuleConstants.java | 14 ----- .../textinput/ReactTextInputManager.java | 61 ++++++++++++------- 3 files changed, 43 insertions(+), 39 deletions(-) diff --git a/Libraries/Components/TextInput/TextInput.js b/Libraries/Components/TextInput/TextInput.js index 53bc6235d..8d69fd589 100644 --- a/Libraries/Components/TextInput/TextInput.js +++ b/Libraries/Components/TextInput/TextInput.js @@ -489,11 +489,12 @@ var TextInput = React.createClass({ }; } - var autoCapitalize = UIManager.UIText.AutocapitalizationType[this.props.autoCapitalize]; - var textAlign = - UIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign]; + var autoCapitalize = + UIManager.AndroidTextInput.Constants.AutoCapitalizationType[this.props.autoCapitalize]; + var textAlign = UIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign]; var textAlignVertical = UIManager.AndroidTextInput.Constants.TextAlignVertical[this.props.textAlignVertical]; + var children = this.props.children; var childCount = 0; ReactChildren.forEach(children, () => ++childCount); diff --git a/ReactAndroid/src/main/java/com/facebook/react/uimanager/UIManagerModuleConstants.java b/ReactAndroid/src/main/java/com/facebook/react/uimanager/UIManagerModuleConstants.java index 3287ebf78..476a2673b 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/uimanager/UIManagerModuleConstants.java +++ b/ReactAndroid/src/main/java/com/facebook/react/uimanager/UIManagerModuleConstants.java @@ -92,20 +92,6 @@ import com.facebook.react.uimanager.events.TouchEventType; "ScaleAspectFill", ImageView.ScaleType.CENTER_CROP.ordinal()))); - constants.put( - "UIText", - MapBuilder.of( - "AutocapitalizationType", - MapBuilder.of( - "none", - InputType.TYPE_CLASS_TEXT, - "characters", - InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS, - "words", - InputType.TYPE_TEXT_FLAG_CAP_WORDS, - "sentences", - InputType.TYPE_TEXT_FLAG_CAP_SENTENCES))); - constants.put( "Dimensions", MapBuilder.of( diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java b/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java index 7df5f52a5..ebb9a31bf 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java @@ -16,6 +16,7 @@ import java.util.Map; import android.graphics.PorterDuff; import android.os.SystemClock; import android.text.Editable; +import android.text.InputFilter; import android.text.InputType; import android.text.Spannable; import android.text.TextWatcher; @@ -25,10 +26,8 @@ import android.view.KeyEvent; import android.view.View; import android.view.inputmethod.EditorInfo; import android.widget.TextView; -import android.text.InputFilter; import com.facebook.infer.annotation.Assertions; -import com.facebook.react.bridge.JSApplicationCausedNativeException; import com.facebook.react.bridge.ReactContext; import com.facebook.react.bridge.ReadableArray; import com.facebook.react.common.MapBuilder; @@ -55,6 +54,10 @@ public class ReactTextInputManager extends private static final int FOCUS_TEXT_INPUT = 1; private static final int BLUR_TEXT_INPUT = 2; + private static final int INPUT_TYPE_KEYBOARD_NUMBERED = + InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL | + InputType.TYPE_NUMBER_FLAG_SIGNED; + private static final String KEYBOARD_TYPE_EMAIL_ADDRESS = "email-address"; private static final String KEYBOARD_TYPE_NUMERIC = "numeric"; private static final InputFilter[] EMPTY_FILTERS = new InputFilter[0]; @@ -253,43 +256,35 @@ public class ReactTextInputManager extends public void setPassword(ReactEditText view, boolean password) { updateStagedInputTypeFlag( view, - password ? 0 : InputType.TYPE_TEXT_VARIATION_PASSWORD, + password ? 0 : + InputType.TYPE_NUMBER_VARIATION_PASSWORD | InputType.TYPE_TEXT_VARIATION_PASSWORD, password ? InputType.TYPE_TEXT_VARIATION_PASSWORD : 0); + checkPasswordType(view); } - @ReactProp(name = "autoCapitalize", defaultInt = InputType.TYPE_CLASS_TEXT) + @ReactProp(name = "autoCapitalize") public void setAutoCapitalize(ReactEditText view, int autoCapitalize) { - int flagsToSet = 0; - switch (autoCapitalize) { - case InputType.TYPE_TEXT_FLAG_CAP_SENTENCES: - case InputType.TYPE_TEXT_FLAG_CAP_WORDS: - case InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS: - case InputType.TYPE_CLASS_TEXT: - flagsToSet = autoCapitalize; - break; - default: - throw new - JSApplicationCausedNativeException("Invalid autoCapitalize value: " + autoCapitalize); - } updateStagedInputTypeFlag( view, InputType.TYPE_TEXT_FLAG_CAP_SENTENCES | InputType.TYPE_TEXT_FLAG_CAP_WORDS | InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS, - flagsToSet); + autoCapitalize); } @ReactProp(name = "keyboardType") public void setKeyboardType(ReactEditText view, @Nullable String keyboardType) { - int flagsToSet = 0; + int flagsToSet = InputType.TYPE_CLASS_TEXT; if (KEYBOARD_TYPE_NUMERIC.equalsIgnoreCase(keyboardType)) { - flagsToSet = InputType.TYPE_CLASS_NUMBER; + flagsToSet = INPUT_TYPE_KEYBOARD_NUMBERED; } else if (KEYBOARD_TYPE_EMAIL_ADDRESS.equalsIgnoreCase(keyboardType)) { - flagsToSet = InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS; + flagsToSet = InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS | InputType.TYPE_CLASS_TEXT; } updateStagedInputTypeFlag( view, - InputType.TYPE_CLASS_NUMBER | InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS, + INPUT_TYPE_KEYBOARD_NUMBERED | InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS | + InputType.TYPE_CLASS_TEXT, flagsToSet); + checkPasswordType(view); } @Override @@ -298,6 +293,18 @@ public class ReactTextInputManager extends view.commitStagedInputType(); } + // Sets the correct password type, since numeric and text passwords have different types + private static void checkPasswordType(ReactEditText view) { + if ((view.getStagedInputType() & INPUT_TYPE_KEYBOARD_NUMBERED) != 0 && + (view.getStagedInputType() & InputType.TYPE_TEXT_VARIATION_PASSWORD) != 0) { + // Text input type is numbered password, remove text password variation, add numeric one + updateStagedInputTypeFlag( + view, + InputType.TYPE_TEXT_VARIATION_PASSWORD, + InputType.TYPE_NUMBER_VARIATION_PASSWORD); + } + } + private static void updateStagedInputTypeFlag( ReactEditText view, int flagsToUnset, @@ -473,6 +480,16 @@ public class ReactTextInputManager extends MapBuilder.of( "top", Gravity.TOP, "center", Gravity.CENTER_VERTICAL, - "bottom", Gravity.BOTTOM)); + "bottom", Gravity.BOTTOM), + "AutoCapitalizationType", + MapBuilder.of( + "none", + 0, + "characters", + InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS, + "words", + InputType.TYPE_TEXT_FLAG_CAP_WORDS, + "sentences", + InputType.TYPE_TEXT_FLAG_CAP_SENTENCES)); } }