Permalink
Browse files

Add `visible-password` for TextInput.keyboardType on Android

Summary:
`visible-password` represents a very basic keyboard, typically only
letters and numbers.  Backed by InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD,
it is useful for things like password and code entry fields. It can also be more
effective than autoCorrect={false} for disabling autocompletion on some keyboards
(like Gboard).

Note `secureTextEntry` also affects `TYPE_TEXT_VARIATION_*` flags internally, so there
may be some undefined behavior when combining `secureTextEntry` with
`keyboardType="visible-password"`

Also, while here, improve the documentation on TextInput to explicitly enumerate
which keyboardType applies to Android vs. iOS (since this is the first android-specific)

Reviewed By: shergin

Differential Revision: D6005353

fbshipit-source-id: 13af90c96353f714c0e106dd0fde90184a476533
  • Loading branch information...
fmoo authored and facebook-github-bot committed Oct 11, 2017
1 parent 7b575d6 commit 752b68857c75a316d8afb5fc7f99d41c0ed68953
@@ -245,6 +245,25 @@ const TextInput = createReactClass({
* - `numeric`
* - `email-address`
* - `phone-pad`
*
* *iOS Only*
*
* The following values work on iOS only:
*
* - `ascii-capable`
* - `numbers-and-punctuation`
* - `url`
* - `number-pad`
* - `name-phone-pad`
* - `decimal-pad`
* - `twitter`
* - `web-search`
*
* *Android Only*
*
* The following values work on Android only:
*
* - `visible-password`
*/
keyboardType: PropTypes.oneOf([
// Cross-platform
@@ -261,6 +280,8 @@ const TextInput = createReactClass({
'decimal-pad',
'twitter',
'web-search',
// Android-only
'visible-password',
]),
/**
* Determines the color of the keyboard.
@@ -77,6 +77,7 @@
private static final String KEYBOARD_TYPE_EMAIL_ADDRESS = "email-address";
private static final String KEYBOARD_TYPE_NUMERIC = "numeric";
private static final String KEYBOARD_TYPE_PHONE_PAD = "phone-pad";
private static final String KEYBOARD_TYPE_VISIBLE_PASSWORD = "visible-password";
private static final InputFilter[] EMPTY_FILTERS = new InputFilter[0];
private static final int UNSET = -1;
@@ -528,6 +529,8 @@ public void setKeyboardType(ReactEditText view, @Nullable String keyboardType) {
flagsToSet = InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS | InputType.TYPE_CLASS_TEXT;
} else if (KEYBOARD_TYPE_PHONE_PAD.equalsIgnoreCase(keyboardType)) {
flagsToSet = InputType.TYPE_CLASS_PHONE;
} else if (KEYBOARD_TYPE_VISIBLE_PASSWORD.equalsIgnoreCase(keyboardType)) {
flagsToSet = InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD;
}
updateStagedInputTypeFlag(
view,

0 comments on commit 752b688

Please sign in to comment.