Skip to content

Commit 75e49a0

Browse files
Jens Panneelfacebook-github-bot
Jens Panneel
authored andcommitted
Feature/add decimal pad to android (#19714)
Summary: For a current use-case we need the a keyboard with characters 0-9 and a decimal point (or comma depending on language settings) This exists on iOS as UIKeyboardType "decimalPad" and this is what react-native maps to for both "numeric" and "decimal-pad". This also exists on Android as inputType "numberDecimal", but is currently not accessible through react-native. This PR maps the value "decimal-pad" of the keyboardType property of TextInput to the Android inputType "numberDecimal", effectively making "decimal-pad" cross platform without breaking anything. * https://facebook.github.io/react-native/docs/textinput.html#keyboardtype * https://developer.apple.com/documentation/uikit/uikeyboardtype * https://developer.android.com/reference/android/widget/TextView#attr_android:inputType There is this bug in some Samsung keyboards where both the - sign and decimal sign disappear when the keyboardType is set to "number" and both the "signed" and "decimal" flags are set. (Like is the case when using the react-native keyboardType prop "numeric".) https://androidforums.com/threads/numeric-soft-keyboard-missing-minus-sign-in-android-8-0-samsung-a5.1272628/ For developers that need decimal numbers but not negative ones, using "decimal-pad" will provide a workaround. I reproduced this on a Samsung A5 only, but maybe other phones have this exact issue. #12988 #12977 #17473 #17474 * Added testcase consistent with existing keyboardType tests * Also added testcase for the related, but missing number-pad This PR follows the same approach as the recently merged PR introducing "number-pad" b638847 Documentation PR: facebook/react-native-website#405 [ANDROID] [ENHANCEMENT] [TextInput] - Added "decimal-pad" keyboard type Closes #19714 Differential Revision: D8429185 Pulled By: mdvacca fbshipit-source-id: 6b56da2088f2be427ebffa04c4e17c91ffb9f7d9
1 parent 0858300 commit 75e49a0

File tree

3 files changed

+16
-4
lines changed

3 files changed

+16
-4
lines changed

Libraries/Components/TextInput/TextInput.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -86,12 +86,12 @@ export type KeyboardType =
8686
| 'numeric'
8787
| 'phone-pad'
8888
| 'number-pad'
89+
| 'decimal-pad'
8990
// iOS-only
9091
| 'ascii-capable'
9192
| 'numbers-and-punctuation'
9293
| 'url'
9394
| 'name-phone-pad'
94-
| 'decimal-pad'
9595
| 'twitter'
9696
| 'web-search'
9797
// Android-only
@@ -388,6 +388,7 @@ const TextInput = createReactClass({
388388
* - `default`
389389
* - `numeric`
390390
* - `number-pad`
391+
* - `decimal-pad`
391392
* - `email-address`
392393
* - `phone-pad`
393394
*
@@ -399,7 +400,6 @@ const TextInput = createReactClass({
399400
* - `numbers-and-punctuation`
400401
* - `url`
401402
* - `name-phone-pad`
402-
* - `decimal-pad`
403403
* - `twitter`
404404
* - `web-search`
405405
*

ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java

+6-2
Original file line numberDiff line numberDiff line change
@@ -70,8 +70,9 @@ public class ReactTextInputManager extends BaseViewManager<ReactEditText, Layout
7070
private static final int BLUR_TEXT_INPUT = 2;
7171

7272
private static final int INPUT_TYPE_KEYBOARD_NUMBER_PAD = InputType.TYPE_CLASS_NUMBER;
73-
private static final int INPUT_TYPE_KEYBOARD_NUMBERED = INPUT_TYPE_KEYBOARD_NUMBER_PAD |
74-
InputType.TYPE_NUMBER_FLAG_DECIMAL |
73+
private static final int INPUT_TYPE_KEYBOARD_DECIMAL_PAD = INPUT_TYPE_KEYBOARD_NUMBER_PAD |
74+
InputType.TYPE_NUMBER_FLAG_DECIMAL;
75+
private static final int INPUT_TYPE_KEYBOARD_NUMBERED = INPUT_TYPE_KEYBOARD_DECIMAL_PAD |
7576
InputType.TYPE_NUMBER_FLAG_SIGNED;
7677
private static final int PASSWORD_VISIBILITY_FLAG = InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD &
7778
~InputType.TYPE_TEXT_VARIATION_PASSWORD;
@@ -82,6 +83,7 @@ public class ReactTextInputManager extends BaseViewManager<ReactEditText, Layout
8283

8384
private static final String KEYBOARD_TYPE_EMAIL_ADDRESS = "email-address";
8485
private static final String KEYBOARD_TYPE_NUMERIC = "numeric";
86+
private static final String KEYBOARD_TYPE_DECIMAL_PAD = "decimal-pad";
8587
private static final String KEYBOARD_TYPE_NUMBER_PAD = "number-pad";
8688
private static final String KEYBOARD_TYPE_PHONE_PAD = "phone-pad";
8789
private static final String KEYBOARD_TYPE_VISIBLE_PASSWORD = "visible-password";
@@ -567,6 +569,8 @@ public void setKeyboardType(ReactEditText view, @Nullable String keyboardType) {
567569
flagsToSet = INPUT_TYPE_KEYBOARD_NUMBERED;
568570
} else if (KEYBOARD_TYPE_NUMBER_PAD.equalsIgnoreCase(keyboardType)) {
569571
flagsToSet = INPUT_TYPE_KEYBOARD_NUMBER_PAD;
572+
} else if (KEYBOARD_TYPE_DECIMAL_PAD.equalsIgnoreCase(keyboardType)) {
573+
flagsToSet = INPUT_TYPE_KEYBOARD_DECIMAL_PAD;
570574
} else if (KEYBOARD_TYPE_EMAIL_ADDRESS.equalsIgnoreCase(keyboardType)) {
571575
flagsToSet = InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS | InputType.TYPE_CLASS_TEXT;
572576
} else if (KEYBOARD_TYPE_PHONE_PAD.equalsIgnoreCase(keyboardType)) {

ReactAndroid/src/test/java/com/facebook/react/views/textinput/ReactTextInputPropertyTest.java

+8
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,8 @@ public void testNumLines() {
231231
@Test
232232
public void testKeyboardType() {
233233
ReactEditText view = mManager.createViewInstance(mThemedContext);
234+
int numberPadTypeFlags = InputType.TYPE_CLASS_NUMBER;
235+
int decimalPadTypeFlags = InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL;
234236
int numericTypeFlags =
235237
InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL |
236238
InputType.TYPE_NUMBER_FLAG_SIGNED;
@@ -249,6 +251,12 @@ public void testKeyboardType() {
249251
mManager.updateProperties(view, buildStyles("keyboardType", "text"));
250252
assertThat(view.getInputType() & generalKeyboardTypeFlags).isEqualTo(InputType.TYPE_CLASS_TEXT);
251253

254+
mManager.updateProperties(view, buildStyles("keyboardType", "number-pad"));
255+
assertThat(view.getInputType() & generalKeyboardTypeFlags).isEqualTo(numberPadTypeFlags);
256+
257+
mManager.updateProperties(view, buildStyles("keyboardType", "decimal-pad"));
258+
assertThat(view.getInputType() & generalKeyboardTypeFlags).isEqualTo(decimalPadTypeFlags);
259+
252260
mManager.updateProperties(view, buildStyles("keyboardType", "numeric"));
253261
assertThat(view.getInputType() & generalKeyboardTypeFlags).isEqualTo(numericTypeFlags);
254262

0 commit comments

Comments
 (0)