mirror of
https://github.com/status-im/poc-core-secure-react-native.git
synced 2025-02-19 21:38:27 +00:00
Add SecureTextInput2 which doesn't rely from ReactEditText
This commit is contained in:
parent
eacdfd895e
commit
9117694f86
@ -11,6 +11,7 @@ import { Platform, StyleSheet, Button, Text, TextInput, View } from 'react-nativ
|
||||
import ToastExample from './ToastExample'
|
||||
import CustomDialog from './CustomDialog'
|
||||
import SecureTextInput from './SecureTextInput'
|
||||
import SecureTextInput2 from './SecureTextInput2'
|
||||
|
||||
const instructions = Platform.select({
|
||||
ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
|
||||
@ -45,6 +46,8 @@ export default class App extends Component<Props> {
|
||||
{/* <TextInput value={this.state.text} onChangeText={(text) => this.onChangeTextInput(text)} /> */}
|
||||
<Text key="instructions" style={styles.instructions}>{this.state.text}</Text>
|
||||
<SecureTextInput key="secure" registrationID="XYZ" />
|
||||
<SecureTextInput2 key="secure" registrationID="XYZ" />
|
||||
<SecureTextInput2 key="secure" registrationID="XYZ" />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
932
StatusPoC/SecureTextInput2.js
Normal file
932
StatusPoC/SecureTextInput2.js
Normal file
@ -0,0 +1,932 @@
|
||||
// ImageView.js
|
||||
|
||||
import {requireNativeComponent} from 'react-native';
|
||||
|
||||
/**
|
||||
* Composes `View`.
|
||||
*
|
||||
* - src: string
|
||||
* - borderRadius: number
|
||||
* - resizeMode: 'cover' | 'contain' | 'stretch'
|
||||
*/
|
||||
//module.exports = requireNativeComponent('RCTSecureTextInput2');
|
||||
const EventEmitter = require('EventEmitter');
|
||||
const NativeMethodsMixin = require('NativeMethodsMixin');
|
||||
const Platform = require('Platform');
|
||||
const PropTypes = require('prop-types');
|
||||
const React = require('React');
|
||||
const ReactNative = require('ReactNative');
|
||||
const Text = require('Text');
|
||||
const TextAncestor = require('TextAncestor');
|
||||
const TextInputState = require('TextInputState');
|
||||
const TouchableWithoutFeedback = require('TouchableWithoutFeedback');
|
||||
const UIManager = require('UIManager');
|
||||
|
||||
const createReactClass = require('create-react-class');
|
||||
const invariant = require('invariant');
|
||||
|
||||
const DataDetectorTypes = [
|
||||
'phoneNumber',
|
||||
'link',
|
||||
'address',
|
||||
'calendarEvent',
|
||||
'none',
|
||||
'all',
|
||||
];
|
||||
|
||||
let AndroidTextInput;
|
||||
if (Platform.OS === 'android') {
|
||||
AndroidTextInput = requireNativeComponent('RCTSecureTextInput2');
|
||||
}
|
||||
|
||||
const TextInput = createReactClass({
|
||||
displayName: 'SecureTextInput2',
|
||||
statics: {
|
||||
State: {
|
||||
currentlyFocusedField: TextInputState.currentlyFocusedField,
|
||||
focusTextInput: TextInputState.focusTextInput,
|
||||
blurTextInput: TextInputState.blurTextInput,
|
||||
},
|
||||
},
|
||||
propTypes: {
|
||||
/**
|
||||
* Can tell `TextInput` to automatically capitalize certain characters.
|
||||
*
|
||||
* - `characters`: all characters.
|
||||
* - `words`: first letter of each word.
|
||||
* - `sentences`: first letter of each sentence (*default*).
|
||||
* - `none`: don't auto capitalize anything.
|
||||
*/
|
||||
autoCapitalize: PropTypes.oneOf([
|
||||
'none',
|
||||
'sentences',
|
||||
'words',
|
||||
'characters',
|
||||
]),
|
||||
/**
|
||||
* If `false`, disables auto-correct. The default value is `true`.
|
||||
*/
|
||||
autoCorrect: PropTypes.bool,
|
||||
/**
|
||||
* If `false`, disables spell-check style (i.e. red underlines).
|
||||
* The default value is inherited from `autoCorrect`.
|
||||
* @platform ios
|
||||
*/
|
||||
spellCheck: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, focuses the input on `componentDidMount`.
|
||||
* The default value is `false`.
|
||||
*/
|
||||
autoFocus: PropTypes.bool,
|
||||
/**
|
||||
* Specifies whether fonts should scale to respect Text Size accessibility settings. The
|
||||
* default is `true`.
|
||||
*/
|
||||
allowFontScaling: PropTypes.bool,
|
||||
/**
|
||||
* Specifies largest possible scale a font can reach when `allowFontScaling` is enabled.
|
||||
* Possible values:
|
||||
* `null/undefined` (default): inherit from the parent node or the global default (0)
|
||||
* `0`: no max, ignore parent/global default
|
||||
* `>= 1`: sets the maxFontSizeMultiplier of this node to this value
|
||||
*/
|
||||
maxFontSizeMultiplier: PropTypes.number,
|
||||
/**
|
||||
* If `false`, text is not editable. The default value is `true`.
|
||||
*/
|
||||
editable: PropTypes.bool,
|
||||
/**
|
||||
* Determines which keyboard to open, e.g.`numeric`.
|
||||
*
|
||||
* The following values work across platforms:
|
||||
*
|
||||
* - `default`
|
||||
* - `numeric`
|
||||
* - `number-pad`
|
||||
* - `decimal-pad`
|
||||
* - `email-address`
|
||||
* - `phone-pad`
|
||||
*
|
||||
* *iOS Only*
|
||||
*
|
||||
* The following values work on iOS only:
|
||||
*
|
||||
* - `ascii-capable`
|
||||
* - `numbers-and-punctuation`
|
||||
* - `url`
|
||||
* - `name-phone-pad`
|
||||
* - `twitter`
|
||||
* - `web-search`
|
||||
*
|
||||
* *Android Only*
|
||||
*
|
||||
* The following values work on Android only:
|
||||
*
|
||||
* - `visible-password`
|
||||
*/
|
||||
keyboardType: PropTypes.oneOf([
|
||||
// Cross-platform
|
||||
'default',
|
||||
'email-address',
|
||||
'numeric',
|
||||
'phone-pad',
|
||||
'number-pad',
|
||||
// iOS-only
|
||||
'ascii-capable',
|
||||
'numbers-and-punctuation',
|
||||
'url',
|
||||
'name-phone-pad',
|
||||
'decimal-pad',
|
||||
'twitter',
|
||||
'web-search',
|
||||
// Android-only
|
||||
'visible-password',
|
||||
]),
|
||||
/**
|
||||
* Determines the color of the keyboard.
|
||||
* @platform ios
|
||||
*/
|
||||
keyboardAppearance: PropTypes.oneOf(['default', 'light', 'dark']),
|
||||
/**
|
||||
* Determines how the return key should look. On Android you can also use
|
||||
* `returnKeyLabel`.
|
||||
*
|
||||
* *Cross platform*
|
||||
*
|
||||
* The following values work across platforms:
|
||||
*
|
||||
* - `done`
|
||||
* - `go`
|
||||
* - `next`
|
||||
* - `search`
|
||||
* - `send`
|
||||
*
|
||||
* *Android Only*
|
||||
*
|
||||
* The following values work on Android only:
|
||||
*
|
||||
* - `none`
|
||||
* - `previous`
|
||||
*
|
||||
* *iOS Only*
|
||||
*
|
||||
* The following values work on iOS only:
|
||||
*
|
||||
* - `default`
|
||||
* - `emergency-call`
|
||||
* - `google`
|
||||
* - `join`
|
||||
* - `route`
|
||||
* - `yahoo`
|
||||
*/
|
||||
returnKeyType: PropTypes.oneOf([
|
||||
// Cross-platform
|
||||
'done',
|
||||
'go',
|
||||
'next',
|
||||
'search',
|
||||
'send',
|
||||
// Android-only
|
||||
'none',
|
||||
'previous',
|
||||
// iOS-only
|
||||
'default',
|
||||
'emergency-call',
|
||||
'google',
|
||||
'join',
|
||||
'route',
|
||||
'yahoo',
|
||||
]),
|
||||
/**
|
||||
* Sets the return key to the label. Use it instead of `returnKeyType`.
|
||||
* @platform android
|
||||
*/
|
||||
returnKeyLabel: PropTypes.string,
|
||||
/**
|
||||
* Limits the maximum number of characters that can be entered. Use this
|
||||
* instead of implementing the logic in JS to avoid flicker.
|
||||
*/
|
||||
maxLength: PropTypes.number,
|
||||
/**
|
||||
* Sets the number of lines for a `TextInput`. Use it with multiline set to
|
||||
* `true` to be able to fill the lines.
|
||||
* @platform android
|
||||
*/
|
||||
numberOfLines: PropTypes.number,
|
||||
/**
|
||||
* When `false`, if there is a small amount of space available around a text input
|
||||
* (e.g. landscape orientation on a phone), the OS may choose to have the user edit
|
||||
* the text inside of a full screen text input mode. When `true`, this feature is
|
||||
* disabled and users will always edit the text directly inside of the text input.
|
||||
* Defaults to `false`.
|
||||
* @platform android
|
||||
*/
|
||||
disableFullscreenUI: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, the keyboard disables the return key when there is no text and
|
||||
* automatically enables it when there is text. The default value is `false`.
|
||||
* @platform ios
|
||||
*/
|
||||
enablesReturnKeyAutomatically: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, the text input can be multiple lines.
|
||||
* The default value is `false`.
|
||||
*/
|
||||
multiline: PropTypes.bool,
|
||||
/**
|
||||
* Set text break strategy on Android API Level 23+, possible values are `simple`, `highQuality`, `balanced`
|
||||
* The default value is `simple`.
|
||||
* @platform android
|
||||
*/
|
||||
textBreakStrategy: PropTypes.oneOf(['simple', 'highQuality', 'balanced']),
|
||||
/**
|
||||
* Callback that is called when the text input is blurred.
|
||||
*/
|
||||
onBlur: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input is focused.
|
||||
*/
|
||||
onFocus: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input's text changes.
|
||||
*/
|
||||
// onChange: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input's text changes.
|
||||
* Changed text is passed as an argument to the callback handler.
|
||||
*/
|
||||
// onChangeText: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input's content size changes.
|
||||
* This will be called with
|
||||
* `{ nativeEvent: { contentSize: { width, height } } }`.
|
||||
*
|
||||
* Only called for multiline text inputs.
|
||||
*/
|
||||
onContentSizeChange: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when text input ends.
|
||||
*/
|
||||
onEndEditing: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input selection is changed.
|
||||
* This will be called with
|
||||
* `{ nativeEvent: { selection: { start, end } } }`.
|
||||
*/
|
||||
onSelectionChange: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when the text input's submit button is pressed.
|
||||
* Invalid if `multiline={true}` is specified.
|
||||
*/
|
||||
onSubmitEditing: PropTypes.func,
|
||||
/**
|
||||
* Callback that is called when a key is pressed.
|
||||
* This will be called with `{ nativeEvent: { key: keyValue } }`
|
||||
* where `keyValue` is `'Enter'` or `'Backspace'` for respective keys and
|
||||
* the typed-in character otherwise including `' '` for space.
|
||||
* Fires before `onChange` callbacks.
|
||||
*/
|
||||
onKeyPress: PropTypes.func,
|
||||
/**
|
||||
* Invoked on mount and layout changes with `{x, y, width, height}`.
|
||||
*/
|
||||
onLayout: PropTypes.func,
|
||||
/**
|
||||
* Invoked on content scroll with `{ nativeEvent: { contentOffset: { x, y } } }`.
|
||||
* May also contain other properties from ScrollEvent but on Android contentSize
|
||||
* is not provided for performance reasons.
|
||||
*/
|
||||
onScroll: PropTypes.func,
|
||||
/**
|
||||
* The string that will be rendered before text input has been entered.
|
||||
*/
|
||||
placeholder: PropTypes.string,
|
||||
/**
|
||||
* The text color of the placeholder string.
|
||||
*/
|
||||
// placeholderTextColor: DeprecatedColorPropType,
|
||||
/**
|
||||
* If `false`, scrolling of the text view will be disabled.
|
||||
* The default value is `true`. Does only work with 'multiline={true}'.
|
||||
* @platform ios
|
||||
*/
|
||||
scrollEnabled: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, the text input obscures the text entered so that sensitive text
|
||||
* like passwords stay secure. The default value is `false`. Does not work with 'multiline={true}'.
|
||||
*/
|
||||
secureTextEntry: PropTypes.bool,
|
||||
/**
|
||||
* The highlight and cursor color of the text input.
|
||||
*/
|
||||
// selectionColor: DeprecatedColorPropType,
|
||||
/**
|
||||
* An instance of `DocumentSelectionState`, this is some state that is responsible for
|
||||
* maintaining selection information for a document.
|
||||
*
|
||||
* Some functionality that can be performed with this instance is:
|
||||
*
|
||||
* - `blur()`
|
||||
* - `focus()`
|
||||
* - `update()`
|
||||
*
|
||||
* > You can reference `DocumentSelectionState` in
|
||||
* > [`vendor/document/selection/DocumentSelectionState.js`](https://github.com/facebook/react-native/blob/master/Libraries/vendor/document/selection/DocumentSelectionState.js)
|
||||
*
|
||||
* @platform ios
|
||||
*/
|
||||
// selectionState: PropTypes.instanceOf(DocumentSelectionState),
|
||||
/**
|
||||
* The start and end of the text input's selection. Set start and end to
|
||||
* the same value to position the cursor.
|
||||
*/
|
||||
selection: PropTypes.shape({
|
||||
start: PropTypes.number.isRequired,
|
||||
end: PropTypes.number,
|
||||
}),
|
||||
/**
|
||||
* The value to show for the text input. `TextInput` is a controlled
|
||||
* component, which means the native value will be forced to match this
|
||||
* value prop if provided. For most uses, this works great, but in some
|
||||
* cases this may cause flickering - one common cause is preventing edits
|
||||
* by keeping value the same. In addition to simply setting the same value,
|
||||
* either set `editable={false}`, or set/update `maxLength` to prevent
|
||||
* unwanted edits without flicker.
|
||||
*/
|
||||
value: PropTypes.string,
|
||||
/**
|
||||
* Provides an initial value that will change when the user starts typing.
|
||||
* Useful for simple use-cases where you do not want to deal with listening
|
||||
* to events and updating the value prop to keep the controlled state in sync.
|
||||
*/
|
||||
defaultValue: PropTypes.string,
|
||||
/**
|
||||
* When the clear button should appear on the right side of the text view.
|
||||
* This property is supported only for single-line TextInput component.
|
||||
* @platform ios
|
||||
*/
|
||||
clearButtonMode: PropTypes.oneOf([
|
||||
'never',
|
||||
'while-editing',
|
||||
'unless-editing',
|
||||
'always',
|
||||
]),
|
||||
/**
|
||||
* If `true`, clears the text field automatically when editing begins.
|
||||
* @platform ios
|
||||
*/
|
||||
clearTextOnFocus: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, all text will automatically be selected on focus.
|
||||
*/
|
||||
selectTextOnFocus: PropTypes.bool,
|
||||
/**
|
||||
* If `true`, the text field will blur when submitted.
|
||||
* The default value is true for single-line fields and false for
|
||||
* multiline fields. Note that for multiline fields, setting `blurOnSubmit`
|
||||
* to `true` means that pressing return will blur the field and trigger the
|
||||
* `onSubmitEditing` event instead of inserting a newline into the field.
|
||||
*/
|
||||
blurOnSubmit: PropTypes.bool,
|
||||
/**
|
||||
* Note that not all Text styles are supported, an incomplete list of what is not supported includes:
|
||||
*
|
||||
* - `borderLeftWidth`
|
||||
* - `borderTopWidth`
|
||||
* - `borderRightWidth`
|
||||
* - `borderBottomWidth`
|
||||
* - `borderTopLeftRadius`
|
||||
* - `borderTopRightRadius`
|
||||
* - `borderBottomRightRadius`
|
||||
* - `borderBottomLeftRadius`
|
||||
*
|
||||
* see [Issue#7070](https://github.com/facebook/react-native/issues/7070)
|
||||
* for more detail.
|
||||
*
|
||||
* [Styles](docs/style.html)
|
||||
*/
|
||||
style: Text.propTypes.style,
|
||||
/**
|
||||
* The color of the `TextInput` underline.
|
||||
* @platform android
|
||||
*/
|
||||
// underlineColorAndroid: DeprecatedColorPropType,
|
||||
|
||||
/**
|
||||
* If defined, the provided image resource will be rendered on the left.
|
||||
* The image resource must be inside `/android/app/src/main/res/drawable` and referenced
|
||||
* like
|
||||
* ```
|
||||
* <TextInput
|
||||
* inlineImageLeft='search_icon'
|
||||
* />
|
||||
* ```
|
||||
* @platform android
|
||||
*/
|
||||
inlineImageLeft: PropTypes.string,
|
||||
|
||||
/**
|
||||
* Padding between the inline image, if any, and the text input itself.
|
||||
* @platform android
|
||||
*/
|
||||
inlineImagePadding: PropTypes.number,
|
||||
|
||||
/**
|
||||
* Determines the types of data converted to clickable URLs in the text input.
|
||||
* Only valid if `multiline={true}` and `editable={false}`.
|
||||
* By default no data types are detected.
|
||||
*
|
||||
* You can provide one type or an array of many types.
|
||||
*
|
||||
* Possible values for `dataDetectorTypes` are:
|
||||
*
|
||||
* - `'phoneNumber'`
|
||||
* - `'link'`
|
||||
* - `'address'`
|
||||
* - `'calendarEvent'`
|
||||
* - `'none'`
|
||||
* - `'all'`
|
||||
*
|
||||
* @platform ios
|
||||
*/
|
||||
dataDetectorTypes: PropTypes.oneOfType([
|
||||
PropTypes.oneOf(DataDetectorTypes),
|
||||
PropTypes.arrayOf(PropTypes.oneOf(DataDetectorTypes)),
|
||||
]),
|
||||
/**
|
||||
* If `true`, caret is hidden. The default value is `false`.
|
||||
* This property is supported only for single-line TextInput component on iOS.
|
||||
*/
|
||||
caretHidden: PropTypes.bool,
|
||||
/*
|
||||
* If `true`, contextMenuHidden is hidden. The default value is `false`.
|
||||
*/
|
||||
contextMenuHidden: PropTypes.bool,
|
||||
/**
|
||||
* An optional identifier which links a custom InputAccessoryView to
|
||||
* this text input. The InputAccessoryView is rendered above the
|
||||
* keyboard when this text input is focused.
|
||||
* @platform ios
|
||||
*/
|
||||
inputAccessoryViewID: PropTypes.string,
|
||||
/**
|
||||
* Give the keyboard and the system information about the
|
||||
* expected semantic meaning for the content that users enter.
|
||||
* @platform ios
|
||||
*/
|
||||
textContentType: PropTypes.oneOf([
|
||||
'none',
|
||||
'URL',
|
||||
'addressCity',
|
||||
'addressCityAndState',
|
||||
'addressState',
|
||||
'countryName',
|
||||
'creditCardNumber',
|
||||
'emailAddress',
|
||||
'familyName',
|
||||
'fullStreetAddress',
|
||||
'givenName',
|
||||
'jobTitle',
|
||||
'location',
|
||||
'middleName',
|
||||
'name',
|
||||
'namePrefix',
|
||||
'nameSuffix',
|
||||
'nickname',
|
||||
'organizationName',
|
||||
'postalCode',
|
||||
'streetAddressLine1',
|
||||
'streetAddressLine2',
|
||||
'sublocality',
|
||||
'telephoneNumber',
|
||||
'username',
|
||||
'password',
|
||||
'newPassword',
|
||||
'oneTimeCode',
|
||||
]),
|
||||
},
|
||||
getDefaultProps() {
|
||||
return {
|
||||
allowFontScaling: true,
|
||||
underlineColorAndroid: 'transparent',
|
||||
};
|
||||
},
|
||||
/**
|
||||
* `NativeMethodsMixin` will look for this when invoking `setNativeProps`. We
|
||||
* make `this` look like an actual native component class.
|
||||
*/
|
||||
mixins: [NativeMethodsMixin],
|
||||
|
||||
/**
|
||||
* Returns `true` if the input is currently focused; `false` otherwise.
|
||||
*/
|
||||
isFocused: function(): boolean {
|
||||
return (
|
||||
TextInputState.currentlyFocusedField() ===
|
||||
ReactNative.findNodeHandle(this._inputRef)
|
||||
);
|
||||
},
|
||||
|
||||
_inputRef: (undefined: any),
|
||||
_focusSubscription: (undefined: ?Function),
|
||||
// _lastNativeText: (undefined: ?string),
|
||||
_lastNativeSelection: (undefined: ?Selection),
|
||||
_rafId: (null: ?AnimationFrameID),
|
||||
|
||||
componentDidMount: function() {
|
||||
// this._lastNativeText = this.props.value;
|
||||
const tag = ReactNative.findNodeHandle(this._inputRef);
|
||||
if (tag != null) {
|
||||
// tag is null only in unit tests
|
||||
TextInputState.registerInput(tag);
|
||||
}
|
||||
|
||||
if (this.context.focusEmitter) {
|
||||
this._focusSubscription = this.context.focusEmitter.addListener(
|
||||
'focus',
|
||||
el => {
|
||||
if (this === el) {
|
||||
this._rafId = requestAnimationFrame(this.focus);
|
||||
} else if (this.isFocused()) {
|
||||
this.blur();
|
||||
}
|
||||
},
|
||||
);
|
||||
if (this.props.autoFocus) {
|
||||
this.context.onFocusRequested(this);
|
||||
}
|
||||
} else {
|
||||
if (this.props.autoFocus) {
|
||||
this._rafId = requestAnimationFrame(this.focus);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
componentWillUnmount: function() {
|
||||
this._focusSubscription && this._focusSubscription.remove();
|
||||
if (this.isFocused()) {
|
||||
this.blur();
|
||||
}
|
||||
const tag = ReactNative.findNodeHandle(this._inputRef);
|
||||
if (tag != null) {
|
||||
TextInputState.unregisterInput(tag);
|
||||
}
|
||||
if (this._rafId != null) {
|
||||
cancelAnimationFrame(this._rafId);
|
||||
}
|
||||
},
|
||||
|
||||
contextTypes: {
|
||||
onFocusRequested: PropTypes.func,
|
||||
focusEmitter: PropTypes.instanceOf(EventEmitter),
|
||||
},
|
||||
|
||||
/**
|
||||
* Removes all text from the `TextInput`.
|
||||
*/
|
||||
clear: function() {
|
||||
this.setNativeProps({text: ''});
|
||||
},
|
||||
|
||||
render: function() {
|
||||
let textInput;
|
||||
if (Platform.OS === 'ios') {
|
||||
textInput = UIManager.getViewManagerConfig('RCTVirtualText')
|
||||
? this._renderIOS()
|
||||
: this._renderIOSLegacy();
|
||||
} else if (Platform.OS === 'android') {
|
||||
textInput = this._renderAndroid();
|
||||
}
|
||||
return (
|
||||
<TextAncestor.Provider value={true}>{textInput}</TextAncestor.Provider>
|
||||
);
|
||||
},
|
||||
|
||||
_getText: function(): ?string {
|
||||
return typeof this.props.value === 'string'
|
||||
? this.props.value
|
||||
: typeof this.props.defaultValue === 'string'
|
||||
? this.props.defaultValue
|
||||
: '';
|
||||
},
|
||||
|
||||
_setNativeRef: function(ref: any) {
|
||||
this._inputRef = ref;
|
||||
},
|
||||
|
||||
_renderIOSLegacy: function() {
|
||||
let textContainer;
|
||||
|
||||
const props = Object.assign({}, this.props);
|
||||
props.style = [this.props.style];
|
||||
|
||||
if (props.selection && props.selection.end == null) {
|
||||
props.selection = {
|
||||
start: props.selection.start,
|
||||
end: props.selection.start,
|
||||
};
|
||||
}
|
||||
|
||||
if (!props.multiline) {
|
||||
if (__DEV__) {
|
||||
for (const propKey in onlyMultiline) {
|
||||
if (props[propKey]) {
|
||||
const error = new Error(
|
||||
'TextInput prop `' +
|
||||
propKey +
|
||||
'` is only supported with multiline.',
|
||||
);
|
||||
warning(false, '%s', error.stack);
|
||||
}
|
||||
}
|
||||
}
|
||||
textContainer = (
|
||||
<RCTSinglelineTextInputView
|
||||
ref={this._setNativeRef}
|
||||
{...props}
|
||||
onFocus={this._onFocus}
|
||||
onBlur={this._onBlur}
|
||||
onChange={this._onChange}
|
||||
onSelectionChange={this._onSelectionChange}
|
||||
onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue}
|
||||
text={this._getText()}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
let children = props.children;
|
||||
let childCount = 0;
|
||||
React.Children.forEach(children, () => ++childCount);
|
||||
invariant(
|
||||
!(props.value && childCount),
|
||||
'Cannot specify both value and children.',
|
||||
);
|
||||
if (childCount >= 1) {
|
||||
children = (
|
||||
<Text
|
||||
style={props.style}
|
||||
allowFontScaling={props.allowFontScaling}
|
||||
maxFontSizeMultiplier={props.maxFontSizeMultiplier}>
|
||||
{children}
|
||||
</Text>
|
||||
);
|
||||
}
|
||||
if (props.inputView) {
|
||||
children = [children, props.inputView];
|
||||
}
|
||||
props.style.unshift(styles.multilineInput);
|
||||
textContainer = (
|
||||
<RCTMultilineTextInputView
|
||||
ref={this._setNativeRef}
|
||||
{...props}
|
||||
children={children}
|
||||
onFocus={this._onFocus}
|
||||
onBlur={this._onBlur}
|
||||
onChange={this._onChange}
|
||||
onContentSizeChange={this.props.onContentSizeChange}
|
||||
onSelectionChange={this._onSelectionChange}
|
||||
onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue}
|
||||
text={this._getText()}
|
||||
dataDetectorTypes={this.props.dataDetectorTypes}
|
||||
onScroll={this._onScroll}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
onLayout={props.onLayout}
|
||||
onPress={this._onPress}
|
||||
rejectResponderTermination={true}
|
||||
accessible={props.accessible}
|
||||
accessibilityLabel={props.accessibilityLabel}
|
||||
accessibilityRole={props.accessibilityRole}
|
||||
accessibilityStates={props.accessibilityStates}
|
||||
nativeID={this.props.nativeID}
|
||||
testID={props.testID}>
|
||||
{textContainer}
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
},
|
||||
|
||||
_renderIOS: function() {
|
||||
const props = Object.assign({}, this.props);
|
||||
props.style = [this.props.style];
|
||||
|
||||
if (props.selection && props.selection.end == null) {
|
||||
props.selection = {
|
||||
start: props.selection.start,
|
||||
end: props.selection.start,
|
||||
};
|
||||
}
|
||||
|
||||
const RCTTextInputView = props.multiline
|
||||
? RCTMultilineTextInputView
|
||||
: RCTSinglelineTextInputView;
|
||||
|
||||
if (props.multiline) {
|
||||
props.style.unshift(styles.multilineInput);
|
||||
}
|
||||
|
||||
const textContainer = (
|
||||
<RCTTextInputView
|
||||
ref={this._setNativeRef}
|
||||
{...props}
|
||||
onFocus={this._onFocus}
|
||||
onBlur={this._onBlur}
|
||||
onChange={this._onChange}
|
||||
onContentSizeChange={this.props.onContentSizeChange}
|
||||
onSelectionChange={this._onSelectionChange}
|
||||
onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue}
|
||||
text={this._getText()}
|
||||
dataDetectorTypes={this.props.dataDetectorTypes}
|
||||
onScroll={this._onScroll}
|
||||
/>
|
||||
);
|
||||
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
onLayout={props.onLayout}
|
||||
onPress={this._onPress}
|
||||
rejectResponderTermination={true}
|
||||
accessible={props.accessible}
|
||||
accessibilityLabel={props.accessibilityLabel}
|
||||
accessibilityRole={props.accessibilityRole}
|
||||
accessibilityStates={props.accessibilityStates}
|
||||
nativeID={this.props.nativeID}
|
||||
testID={props.testID}>
|
||||
{textContainer}
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
},
|
||||
|
||||
_renderAndroid: function() {
|
||||
const props = Object.assign({}, this.props);
|
||||
props.style = [this.props.style];
|
||||
// props.autoCapitalize = UIManager.getViewManagerConfig(
|
||||
// 'AndroidTextInput',
|
||||
// ).Constants.AutoCapitalizationType[props.autoCapitalize || 'sentences'];
|
||||
// props.autoCapitalize = false;
|
||||
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This comment
|
||||
* suppresses an error when upgrading Flow's support for React. To see the
|
||||
* error delete this comment and run Flow. */
|
||||
let children = this.props.children;
|
||||
let childCount = 0;
|
||||
React.Children.forEach(children, () => ++childCount);
|
||||
invariant(
|
||||
!(this.props.value && childCount),
|
||||
'Cannot specify both value and children.',
|
||||
);
|
||||
if (childCount > 1) {
|
||||
children = <Text>{children}</Text>;
|
||||
}
|
||||
|
||||
if (props.selection && props.selection.end == null) {
|
||||
props.selection = {
|
||||
start: props.selection.start,
|
||||
end: props.selection.start,
|
||||
};
|
||||
}
|
||||
|
||||
const textContainer = (
|
||||
<AndroidTextInput
|
||||
ref={this._setNativeRef}
|
||||
{...props}
|
||||
mostRecentEventCount={0}
|
||||
onFocus={this._onFocus}
|
||||
onBlur={this._onBlur}
|
||||
onSelectionChange={this._onSelectionChange}
|
||||
text={this._getText()}
|
||||
children={children}
|
||||
disableFullscreenUI={this.props.disableFullscreenUI}
|
||||
textBreakStrategy={this.props.textBreakStrategy}
|
||||
onScroll={this._onScroll}
|
||||
/>
|
||||
);
|
||||
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
onLayout={props.onLayout}
|
||||
onPress={this._onPress}
|
||||
accessible={this.props.accessible}
|
||||
accessibilityLabel={this.props.accessibilityLabel}
|
||||
accessibilityRole={this.props.accessibilityRole}
|
||||
accessibilityStates={this.props.accessibilityStates}
|
||||
nativeID={this.props.nativeID}
|
||||
testID={this.props.testID}>
|
||||
{textContainer}
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
},
|
||||
|
||||
_onFocus: function(event: FocusEvent) {
|
||||
if (this.props.onFocus) {
|
||||
this.props.onFocus(event);
|
||||
}
|
||||
|
||||
if (this.props.selectionState) {
|
||||
this.props.selectionState.focus();
|
||||
}
|
||||
},
|
||||
|
||||
_onPress: function(event: PressEvent) {
|
||||
if (this.props.editable || this.props.editable === undefined) {
|
||||
this.focus();
|
||||
}
|
||||
},
|
||||
|
||||
_onChange: function(event: ChangeEvent) {
|
||||
// Make sure to fire the mostRecentEventCount first so it is already set on
|
||||
// native when the text value is set.
|
||||
if (this._inputRef && this._inputRef.setNativeProps) {
|
||||
this._inputRef.setNativeProps({
|
||||
mostRecentEventCount: event.nativeEvent.eventCount,
|
||||
});
|
||||
}
|
||||
|
||||
// const text = event.nativeEvent.text;
|
||||
// this.props.onChange && this.props.onChange(event);
|
||||
// this.props.onChangeText && this.props.onChangeText(text);
|
||||
|
||||
if (!this._inputRef) {
|
||||
// calling `this.props.onChange` or `this.props.onChangeText`
|
||||
// may clean up the input itself. Exits here.
|
||||
return;
|
||||
}
|
||||
|
||||
// this._lastNativeText = text;
|
||||
this.forceUpdate();
|
||||
},
|
||||
|
||||
_onSelectionChange: function(event: SelectionChangeEvent) {
|
||||
this.props.onSelectionChange && this.props.onSelectionChange(event);
|
||||
|
||||
if (!this._inputRef) {
|
||||
// calling `this.props.onSelectionChange`
|
||||
// may clean up the input itself. Exits here.
|
||||
return;
|
||||
}
|
||||
|
||||
this._lastNativeSelection = event.nativeEvent.selection;
|
||||
|
||||
if (this.props.selection || this.props.selectionState) {
|
||||
this.forceUpdate();
|
||||
}
|
||||
},
|
||||
|
||||
componentDidUpdate: function() {
|
||||
// This is necessary in case native updates the text and JS decides
|
||||
// that the update should be ignored and we should stick with the value
|
||||
// that we have in JS.
|
||||
const nativeProps = {};
|
||||
|
||||
// if (
|
||||
// this._lastNativeText !== this.props.value &&
|
||||
// typeof this.props.value === 'string'
|
||||
// ) {
|
||||
// nativeProps.text = this.props.value;
|
||||
// }
|
||||
|
||||
// Selection is also a controlled prop, if the native value doesn't match
|
||||
// JS, update to the JS value.
|
||||
const {selection} = this.props;
|
||||
if (
|
||||
this._lastNativeSelection &&
|
||||
selection &&
|
||||
(this._lastNativeSelection.start !== selection.start ||
|
||||
this._lastNativeSelection.end !== selection.end)
|
||||
) {
|
||||
nativeProps.selection = this.props.selection;
|
||||
}
|
||||
|
||||
if (
|
||||
Object.keys(nativeProps).length > 0 &&
|
||||
this._inputRef &&
|
||||
this._inputRef.setNativeProps
|
||||
) {
|
||||
this._inputRef.setNativeProps(nativeProps);
|
||||
}
|
||||
|
||||
if (this.props.selectionState && selection) {
|
||||
this.props.selectionState.update(selection.start, selection.end);
|
||||
}
|
||||
},
|
||||
|
||||
_onBlur: function(event: BlurEvent) {
|
||||
// This is a hack to fix https://fburl.com/toehyir8
|
||||
// @todo(rsnara) Figure out why this is necessary.
|
||||
this.blur();
|
||||
if (this.props.onBlur) {
|
||||
this.props.onBlur(event);
|
||||
}
|
||||
|
||||
if (this.props.selectionState) {
|
||||
this.props.selectionState.blur();
|
||||
}
|
||||
},
|
||||
|
||||
_onScroll: function(event: ScrollEvent) {
|
||||
this.props.onScroll && this.props.onScroll(event);
|
||||
},
|
||||
});
|
||||
|
||||
module.exports = TextInput;
|
@ -11,7 +11,8 @@ public class FireMissilesDialogFragment extends DialogFragment {
|
||||
public Dialog onCreateDialog(Bundle savedInstanceState) {
|
||||
// Use the Builder class for convenient dialog construction
|
||||
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
|
||||
String text = ReactSecureTextInputManager.getText("XYZ");
|
||||
//String text = ReactSecureTextInputManager.getText("XYZ");
|
||||
String text = SecureTextInputManager.getText("XYZ");
|
||||
builder.setMessage("Fire missiles?")
|
||||
.setPositiveButton(text, new DialogInterface.OnClickListener() {
|
||||
public void onClick(DialogInterface dialog, int id) {
|
||||
|
@ -43,6 +43,7 @@ public class MainApplication extends Application implements ReactApplication {
|
||||
@Override
|
||||
public void onCreate() {
|
||||
ReactSecureTextInputManager.setText("XYZ", "Initial text");
|
||||
SecureTextInputManager.setText("XYZ", "Initial text");
|
||||
super.onCreate();
|
||||
SoLoader.init(this, /* native exopackage */ false);
|
||||
}
|
||||
|
@ -19,7 +19,8 @@ public class ReactSecureTextInputPackage implements ReactPackage {
|
||||
public List<ViewManager> createViewManagers(
|
||||
ReactApplicationContext reactContext) {
|
||||
return Arrays.<ViewManager>asList(
|
||||
new ReactSecureTextInputManager()
|
||||
new ReactSecureTextInputManager(),
|
||||
new SecureTextInputManager()
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -0,0 +1,411 @@
|
||||
package com.statuspoc;
|
||||
|
||||
import android.content.Context;
|
||||
import android.graphics.Rect;
|
||||
import android.graphics.Typeface;
|
||||
import android.os.Build;
|
||||
import android.text.Editable;
|
||||
import android.text.InputType;
|
||||
import android.text.TextWatcher;
|
||||
import android.text.method.KeyListener;
|
||||
import android.text.method.QwertyKeyListener;
|
||||
import android.view.KeyEvent;
|
||||
import android.view.View;
|
||||
import android.view.inputmethod.EditorInfo;
|
||||
import android.view.inputmethod.InputConnection;
|
||||
import android.view.inputmethod.InputMethodManager;
|
||||
import android.widget.EditText;
|
||||
|
||||
import com.facebook.infer.annotation.Assertions;
|
||||
import com.facebook.react.bridge.ReactContext;
|
||||
import com.facebook.react.uimanager.PixelUtil;
|
||||
import com.facebook.react.uimanager.UIManagerModule;
|
||||
import com.facebook.react.views.textinput.ContentSizeWatcher;
|
||||
import com.facebook.react.views.textinput.ReactTextInputLocalData;
|
||||
import com.facebook.react.views.view.ReactViewBackgroundManager;
|
||||
import javax.annotation.Nullable;
|
||||
|
||||
/**
|
||||
* A wrapper around the EditText that lets us better control what happens when an EditText gets
|
||||
* focused or blurred, and when to display the soft keyboard and when not to.
|
||||
*
|
||||
* ReactEditTexts have setFocusableInTouchMode set to false automatically because touches on the
|
||||
* EditText are managed on the JS side. This also removes the nasty side effect that EditTexts
|
||||
* have, which is that focus is always maintained on one of the EditTexts.
|
||||
*/
|
||||
public class SecureEditText extends EditText {
|
||||
private SecureTextInputManager mManager;
|
||||
private final InputMethodManager mInputMethodManager;
|
||||
// This component is controlled, so we want it to get focused only when JS ask it to do so.
|
||||
// Whenever android requests focus (which it does for random reasons), it will be ignored.
|
||||
private boolean mIsJSSettingFocus;
|
||||
private int mStagedInputType;
|
||||
private @Nullable Boolean mBlurOnSubmit;
|
||||
private boolean mDisableFullscreen;
|
||||
private @Nullable String mReturnKeyType;
|
||||
private @Nullable ContentSizeWatcher mContentSizeWatcher;
|
||||
private final InternalKeyListener mKeyListener;
|
||||
private float mLetterSpacingPt = 0;
|
||||
|
||||
private ReactViewBackgroundManager mReactBackgroundManager;
|
||||
|
||||
private static final KeyListener sKeyListener = QwertyKeyListener.getInstanceForFullKeyboard();
|
||||
|
||||
public SecureEditText(SecureTextInputManager manager, Context context) {
|
||||
super(context);
|
||||
setFocusableInTouchMode(false);
|
||||
|
||||
mManager = manager;
|
||||
mReactBackgroundManager = new ReactViewBackgroundManager(this);
|
||||
mInputMethodManager = (InputMethodManager)
|
||||
Assertions.assertNotNull(getContext().getSystemService(Context.INPUT_METHOD_SERVICE));
|
||||
mIsJSSettingFocus = false;
|
||||
mBlurOnSubmit = null;
|
||||
mDisableFullscreen = false;
|
||||
mStagedInputType = getInputType();
|
||||
mKeyListener = new InternalKeyListener();
|
||||
}
|
||||
|
||||
@Override
|
||||
public final void addTextChangedListener(TextWatcher watcher) throws java.lang.SecurityException {
|
||||
if (!(watcher instanceof SecureTextInputManager.SecureReactTextInputTextWatcher)) {
|
||||
// Explicitly disallow third-party subscribers
|
||||
throw new java.lang.SecurityException();
|
||||
}
|
||||
|
||||
super.addTextChangedListener(watcher);
|
||||
}
|
||||
|
||||
public void setContentSizeWatcher(ContentSizeWatcher contentSizeWatcher) {
|
||||
mContentSizeWatcher = contentSizeWatcher;
|
||||
}
|
||||
|
||||
// After the text changes inside an EditText, TextView checks if a layout() has been requested.
|
||||
// If it has, it will not scroll the text to the end of the new text inserted, but wait for the
|
||||
// next layout() to be called. However, we do not perform a layout() after a requestLayout(), so
|
||||
// we need to override isLayoutRequested to force EditText to scroll to the end of the new text
|
||||
// immediately.
|
||||
// TODO: t6408636 verify if we should schedule a layout after a View does a requestLayout()
|
||||
@Override
|
||||
public boolean isLayoutRequested() {
|
||||
return false;
|
||||
}
|
||||
|
||||
@Override
|
||||
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
|
||||
onContentSizeChange();
|
||||
}
|
||||
|
||||
// Consume 'Enter' key events: TextView tries to give focus to the next TextInput, but it can't
|
||||
// since we only allow JS to change focus, which in turn causes TextView to crash.
|
||||
@Override
|
||||
public boolean onKeyUp(int keyCode, KeyEvent event) {
|
||||
if (keyCode == KeyEvent.KEYCODE_ENTER && !isMultiline()) {
|
||||
hideSoftKeyboard();
|
||||
return true;
|
||||
}
|
||||
return super.onKeyUp(keyCode, event);
|
||||
}
|
||||
|
||||
@Override
|
||||
public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
|
||||
ReactContext reactContext = (ReactContext) getContext();
|
||||
InputConnection inputConnection = super.onCreateInputConnection(outAttrs);
|
||||
// if (inputConnection != null && mOnKeyPress) {
|
||||
// inputConnection = new ReactEditTextInputConnectionWrapper(inputConnection, reactContext, this);
|
||||
// }
|
||||
|
||||
if (isMultiline() && getBlurOnSubmit()) {
|
||||
// Remove IME_FLAG_NO_ENTER_ACTION to keep the original IME_OPTION
|
||||
outAttrs.imeOptions &= ~EditorInfo.IME_FLAG_NO_ENTER_ACTION;
|
||||
}
|
||||
return inputConnection;
|
||||
}
|
||||
|
||||
@Override
|
||||
public void clearFocus() {
|
||||
setFocusableInTouchMode(false);
|
||||
super.clearFocus();
|
||||
hideSoftKeyboard();
|
||||
}
|
||||
|
||||
@Override
|
||||
public boolean requestFocus(int direction, Rect previouslyFocusedRect) {
|
||||
// Always return true if we are already focused. This is used by android in certain places,
|
||||
// such as text selection.
|
||||
if (isFocused()) {
|
||||
return true;
|
||||
}
|
||||
if (!mIsJSSettingFocus) {
|
||||
return false;
|
||||
}
|
||||
setFocusableInTouchMode(true);
|
||||
boolean focused = super.requestFocus(direction, previouslyFocusedRect);
|
||||
showSoftKeyboard();
|
||||
return focused;
|
||||
}
|
||||
|
||||
@Override
|
||||
public void onTextChanged(CharSequence s, int start, int before, int count) {
|
||||
// if (!mIsSettingTextFromJS && mListeners != null) {
|
||||
// for (TextWatcher listener : mListeners) {
|
||||
// listener.onTextChanged(s, start, before, count);
|
||||
// }
|
||||
// }
|
||||
|
||||
onContentSizeChange();
|
||||
}
|
||||
|
||||
private boolean isMultiline() {
|
||||
return (getInputType() & InputType.TYPE_TEXT_FLAG_MULTI_LINE) != 0;
|
||||
}
|
||||
|
||||
private boolean isSecureText() {
|
||||
return
|
||||
(getInputType() &
|
||||
(InputType.TYPE_NUMBER_VARIATION_PASSWORD |
|
||||
InputType.TYPE_TEXT_VARIATION_PASSWORD))
|
||||
!= 0;
|
||||
}
|
||||
|
||||
private void onContentSizeChange() {
|
||||
// if (mContentSizeWatcher != null) {
|
||||
// mContentSizeWatcher.onLayout();
|
||||
// }
|
||||
|
||||
setIntrinsicContentSize();
|
||||
}
|
||||
|
||||
private void setIntrinsicContentSize() {
|
||||
ReactContext reactContext = (ReactContext) getContext();
|
||||
UIManagerModule uiManager = reactContext.getNativeModule(UIManagerModule.class);
|
||||
final ReactTextInputLocalData localData = new ReactTextInputLocalData(this);
|
||||
uiManager.setViewLocalData(getId(), localData);
|
||||
}
|
||||
|
||||
private void updateImeOptions() {
|
||||
// Default to IME_ACTION_DONE
|
||||
int returnKeyFlag = EditorInfo.IME_ACTION_DONE;
|
||||
if (mReturnKeyType != null) {
|
||||
switch (mReturnKeyType) {
|
||||
case "go":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_GO;
|
||||
break;
|
||||
case "next":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_NEXT;
|
||||
break;
|
||||
case "none":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_NONE;
|
||||
break;
|
||||
case "previous":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_PREVIOUS;
|
||||
break;
|
||||
case "search":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_SEARCH;
|
||||
break;
|
||||
case "send":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_SEND;
|
||||
break;
|
||||
case "done":
|
||||
returnKeyFlag = EditorInfo.IME_ACTION_DONE;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (mDisableFullscreen) {
|
||||
setImeOptions(returnKeyFlag | EditorInfo.IME_FLAG_NO_FULLSCREEN);
|
||||
} else {
|
||||
setImeOptions(returnKeyFlag);
|
||||
}
|
||||
}
|
||||
|
||||
public void setBlurOnSubmit(@Nullable Boolean blurOnSubmit) {
|
||||
mBlurOnSubmit = blurOnSubmit;
|
||||
}
|
||||
|
||||
public boolean getBlurOnSubmit() {
|
||||
if (mBlurOnSubmit == null) {
|
||||
// Default blurOnSubmit
|
||||
return isMultiline() ? false : true;
|
||||
}
|
||||
|
||||
return mBlurOnSubmit;
|
||||
}
|
||||
|
||||
public void setDisableFullscreenUI(boolean disableFullscreenUI) {
|
||||
mDisableFullscreen = disableFullscreenUI;
|
||||
updateImeOptions();
|
||||
}
|
||||
|
||||
public boolean getDisableFullscreenUI() {
|
||||
return mDisableFullscreen;
|
||||
}
|
||||
|
||||
public void setReturnKeyType(String returnKeyType) {
|
||||
mReturnKeyType = returnKeyType;
|
||||
updateImeOptions();
|
||||
}
|
||||
|
||||
public String getReturnKeyType() {
|
||||
return mReturnKeyType;
|
||||
}
|
||||
|
||||
/*protected*/ int getStagedInputType() {
|
||||
return mStagedInputType;
|
||||
}
|
||||
|
||||
/*package*/ void setStagedInputType(int stagedInputType) {
|
||||
mStagedInputType = stagedInputType;
|
||||
}
|
||||
|
||||
/*package*/ void commitStagedInputType() {
|
||||
if (getInputType() != mStagedInputType) {
|
||||
int selectionStart = getSelectionStart();
|
||||
int selectionEnd = getSelectionEnd();
|
||||
setInputType(mStagedInputType);
|
||||
setSelection(selectionStart, selectionEnd);
|
||||
}
|
||||
}
|
||||
|
||||
@Override
|
||||
public void setInputType(int type) {
|
||||
Typeface tf = super.getTypeface();
|
||||
super.setInputType(type);
|
||||
mStagedInputType = type;
|
||||
// Input type password defaults to monospace font, so we need to re-apply the font
|
||||
super.setTypeface(tf);
|
||||
|
||||
// We override the KeyListener so that all keys on the soft input keyboard as well as hardware
|
||||
// keyboards work. Some KeyListeners like DigitsKeyListener will display the keyboard but not
|
||||
// accept all input from it
|
||||
mKeyListener.setInputType(type);
|
||||
setKeyListener(mKeyListener);
|
||||
}
|
||||
|
||||
// VisibleForTesting from {@link TextInputEventsTestCase}.
|
||||
public void requestFocusFromJS() {
|
||||
mIsJSSettingFocus = true;
|
||||
requestFocus();
|
||||
mIsJSSettingFocus = false;
|
||||
}
|
||||
|
||||
/* package */ void clearFocusFromJS() {
|
||||
clearFocus();
|
||||
}
|
||||
|
||||
private boolean showSoftKeyboard() {
|
||||
return mInputMethodManager.showSoftInput(this, 0);
|
||||
}
|
||||
|
||||
private void hideSoftKeyboard() {
|
||||
mInputMethodManager.hideSoftInputFromWindow(getWindowToken(), 0);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void onDetachedFromWindow() {
|
||||
super.onDetachedFromWindow();
|
||||
|
||||
this.mManager.onDetachedFromWindow(this);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void setBackgroundColor(int color) {
|
||||
mReactBackgroundManager.setBackgroundColor(color);
|
||||
}
|
||||
|
||||
public void setBorderWidth(int position, float width) {
|
||||
mReactBackgroundManager.setBorderWidth(position, width);
|
||||
}
|
||||
|
||||
public void setBorderColor(int position, float color, float alpha) {
|
||||
mReactBackgroundManager.setBorderColor(position, color, alpha);
|
||||
}
|
||||
|
||||
public void setBorderRadius(float borderRadius) {
|
||||
mReactBackgroundManager.setBorderRadius(borderRadius);
|
||||
}
|
||||
|
||||
public void setBorderRadius(float borderRadius, int position) {
|
||||
mReactBackgroundManager.setBorderRadius(borderRadius, position);
|
||||
}
|
||||
|
||||
public void setBorderStyle(@Nullable String style) {
|
||||
mReactBackgroundManager.setBorderStyle(style);
|
||||
}
|
||||
|
||||
public void setLetterSpacingPt(float letterSpacingPt) {
|
||||
mLetterSpacingPt = letterSpacingPt;
|
||||
updateLetterSpacing();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void setTextSize (float size) {
|
||||
super.setTextSize(size);
|
||||
updateLetterSpacing();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void setTextSize (int unit, float size) {
|
||||
super.setTextSize(unit, size);
|
||||
updateLetterSpacing();
|
||||
}
|
||||
|
||||
protected void updateLetterSpacing() {
|
||||
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
|
||||
setLetterSpacing(PixelUtil.toPixelFromSP(mLetterSpacingPt) / getTextSize());
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* This class is set as the KeyListener for the underlying TextView
|
||||
* It does two things
|
||||
* 1) Provides the same answer to getInputType() as the real KeyListener would have which allows
|
||||
* the proper keyboard to pop up on screen
|
||||
* 2) Permits all keyboard input through
|
||||
*/
|
||||
private static class InternalKeyListener implements KeyListener {
|
||||
|
||||
private int mInputType = 0;
|
||||
|
||||
public InternalKeyListener() {
|
||||
}
|
||||
|
||||
public void setInputType(int inputType) {
|
||||
mInputType = inputType;
|
||||
}
|
||||
|
||||
/*
|
||||
* getInputType will return whatever value is passed in. This will allow the proper keyboard
|
||||
* to be shown on screen but without the actual filtering done by other KeyListeners
|
||||
*/
|
||||
@Override
|
||||
public int getInputType() {
|
||||
return mInputType;
|
||||
}
|
||||
|
||||
/*
|
||||
* All overrides of key handling defer to the underlying KeyListener which is shared by all
|
||||
* ReactEditText instances. It will basically allow any/all keyboard input whether from
|
||||
* physical keyboard or from soft input.
|
||||
*/
|
||||
@Override
|
||||
public boolean onKeyDown(View view, Editable text, int keyCode, KeyEvent event) {
|
||||
return sKeyListener.onKeyDown(view, text, keyCode, event);
|
||||
}
|
||||
|
||||
@Override
|
||||
public boolean onKeyUp(View view, Editable text, int keyCode, KeyEvent event) {
|
||||
return sKeyListener.onKeyUp(view, text, keyCode, event);
|
||||
}
|
||||
|
||||
@Override
|
||||
public boolean onKeyOther(View view, Editable text, KeyEvent event) {
|
||||
return sKeyListener.onKeyOther(view, text, event);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void clearMetaKeyState(View view, Editable content, int states) {
|
||||
sKeyListener.clearMetaKeyState(view, content, states);
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,451 @@
|
||||
package com.statuspoc;
|
||||
|
||||
import android.util.Log;
|
||||
import android.text.Editable;
|
||||
import android.text.InputType;
|
||||
import android.text.TextWatcher;
|
||||
import android.util.TypedValue;
|
||||
import android.widget.EditText;
|
||||
import android.util.ArrayMap;
|
||||
import com.facebook.infer.annotation.Assertions;
|
||||
import com.facebook.react.bridge.ReactContext;
|
||||
import com.facebook.react.bridge.ReadableArray;
|
||||
import com.facebook.react.common.MapBuilder;
|
||||
import com.facebook.react.module.annotations.ReactModule;
|
||||
import com.facebook.react.uimanager.BaseViewManager;
|
||||
import com.facebook.react.uimanager.LayoutShadowNode;
|
||||
import com.facebook.react.uimanager.PixelUtil;
|
||||
import com.facebook.react.uimanager.Spacing;
|
||||
import com.facebook.react.uimanager.ThemedReactContext;
|
||||
import com.facebook.react.uimanager.UIManagerModule;
|
||||
import com.facebook.react.uimanager.ViewDefaults;
|
||||
import com.facebook.react.uimanager.ViewProps;
|
||||
import com.facebook.react.uimanager.annotations.ReactProp;
|
||||
import com.facebook.react.uimanager.annotations.ReactPropGroup;
|
||||
import com.facebook.react.uimanager.events.EventDispatcher;
|
||||
import com.facebook.react.views.text.ReactTextUpdate;
|
||||
import com.facebook.react.views.textinput.ContentSizeWatcher;
|
||||
import com.facebook.react.views.textinput.ReactTextInputShadowNode;
|
||||
import com.facebook.react.views.textinput.ReactContentSizeChangedEvent;
|
||||
import com.facebook.yoga.YogaConstants;
|
||||
import java.util.Map;
|
||||
|
||||
import javax.annotation.Nullable;
|
||||
|
||||
/**
|
||||
* Manages instances of SecureTextInput2.
|
||||
*/
|
||||
@ReactModule(name = SecureTextInputManager.REACT_CLASS)
|
||||
public class SecureTextInputManager extends BaseViewManager<SecureEditText, LayoutShadowNode> {
|
||||
|
||||
protected static final String REACT_CLASS = "RCTSecureTextInput2";
|
||||
private static final ArrayMap<String, String> registrationMap = new ArrayMap<String, String>();
|
||||
private static final ArrayMap<EditText, String> viewToIdMap = new ArrayMap<EditText, String>();
|
||||
private static final ArrayMap<String, EditText> idToViewMap = new ArrayMap<String, EditText>();
|
||||
|
||||
private static final int[] SPACING_TYPES = {
|
||||
Spacing.ALL, Spacing.LEFT, Spacing.RIGHT, Spacing.TOP, Spacing.BOTTOM,
|
||||
};
|
||||
|
||||
private static final int FOCUS_TEXT_INPUT = 1;
|
||||
private static final int BLUR_TEXT_INPUT = 2;
|
||||
|
||||
private static final int INPUT_TYPE_KEYBOARD_NUMBER_PAD = InputType.TYPE_CLASS_NUMBER;
|
||||
private static final int INPUT_TYPE_KEYBOARD_DECIMAL_PAD = INPUT_TYPE_KEYBOARD_NUMBER_PAD |
|
||||
InputType.TYPE_NUMBER_FLAG_DECIMAL;
|
||||
private static final int INPUT_TYPE_KEYBOARD_NUMBERED = INPUT_TYPE_KEYBOARD_DECIMAL_PAD |
|
||||
InputType.TYPE_NUMBER_FLAG_SIGNED;
|
||||
private static final int PASSWORD_VISIBILITY_FLAG = InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD &
|
||||
~InputType.TYPE_TEXT_VARIATION_PASSWORD;
|
||||
private static final int KEYBOARD_TYPE_FLAGS = INPUT_TYPE_KEYBOARD_NUMBERED |
|
||||
InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS |
|
||||
InputType.TYPE_CLASS_TEXT | InputType.TYPE_CLASS_PHONE |
|
||||
PASSWORD_VISIBILITY_FLAG;
|
||||
|
||||
private static final String KEYBOARD_TYPE_EMAIL_ADDRESS = "email-address";
|
||||
private static final String KEYBOARD_TYPE_NUMERIC = "numeric";
|
||||
private static final String KEYBOARD_TYPE_DECIMAL_PAD = "decimal-pad";
|
||||
private static final String KEYBOARD_TYPE_NUMBER_PAD = "number-pad";
|
||||
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;
|
||||
|
||||
@Override
|
||||
public String getName() {
|
||||
return REACT_CLASS;
|
||||
}
|
||||
|
||||
@ReactProp(name = "registrationID")
|
||||
public void setRegistrationId(SecureEditText view, String id) throws java.lang.SecurityException, IllegalArgumentException {
|
||||
if (view == null) {
|
||||
throw new IllegalArgumentException("view");
|
||||
}
|
||||
if (id == null) {
|
||||
throw new IllegalArgumentException("id");
|
||||
}
|
||||
|
||||
if (!registrationMap.containsKey(id)) {
|
||||
registrationMap.put(id, view.getText().toString());
|
||||
}
|
||||
viewToIdMap.put(view, id);
|
||||
idToViewMap.put(id, view);
|
||||
|
||||
view.addTextChangedListener(new SecureReactTextInputTextWatcher(view));
|
||||
// view.setOnKeyPress(false);
|
||||
}
|
||||
|
||||
public static String getText(final String id) {
|
||||
return registrationMap.get(id);
|
||||
}
|
||||
|
||||
public static void setText(final String id, final String value) {
|
||||
registrationMap.put(id, value);
|
||||
|
||||
Log.d(REACT_CLASS, "setText called with " + value);
|
||||
final EditText view = idToViewMap.get(id);
|
||||
if (view != null) {
|
||||
view.setText(value);
|
||||
Log.d(REACT_CLASS, "called setText on EditText with " + value);
|
||||
}
|
||||
}
|
||||
|
||||
@Override
|
||||
public final SecureEditText createViewInstance(ThemedReactContext context) {
|
||||
SecureEditText editText = new SecureEditText(this, context);
|
||||
int inputType = editText.getInputType();
|
||||
editText.setInputType(inputType & (~InputType.TYPE_TEXT_FLAG_MULTI_LINE));
|
||||
// editText.setReturnKeyType("done");
|
||||
editText.setTextSize(
|
||||
TypedValue.COMPLEX_UNIT_PX,
|
||||
(int) Math.ceil(PixelUtil.toPixelFromSP(ViewDefaults.FONT_SIZE_SP)));
|
||||
return editText;
|
||||
}
|
||||
|
||||
@Override
|
||||
public LayoutShadowNode createShadowNodeInstance() {
|
||||
return new ReactTextInputShadowNode();
|
||||
}
|
||||
|
||||
@Override
|
||||
public Class<? extends LayoutShadowNode> getShadowNodeClass() {
|
||||
return ReactTextInputShadowNode.class;
|
||||
}
|
||||
|
||||
void onDetachedFromWindow(SecureEditText view) {
|
||||
final String id = this.viewToIdMap.get(view);
|
||||
if (id == null) {
|
||||
Log.d(REACT_CLASS, "unknown SecureEditText detached");
|
||||
return;
|
||||
}
|
||||
|
||||
this.viewToIdMap.remove(view);
|
||||
this.idToViewMap.remove(id);
|
||||
this.registrationMap.remove(id);
|
||||
}
|
||||
|
||||
class SecureReactTextInputTextWatcher implements TextWatcher {
|
||||
|
||||
private SecureEditText mEditText;
|
||||
private String mPreviousText;
|
||||
|
||||
public SecureReactTextInputTextWatcher(
|
||||
final SecureEditText editText) {
|
||||
mEditText = editText;
|
||||
mPreviousText = null;
|
||||
}
|
||||
|
||||
@Override
|
||||
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
|
||||
// Incoming charSequence gets mutated before onTextChanged() is invoked
|
||||
mPreviousText = s.toString();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void onTextChanged(CharSequence s, int start, int before, int count) {
|
||||
// Rearranging the text (i.e. changing between singleline and multiline attributes) can
|
||||
// also trigger onTextChanged
|
||||
if (count == 0 && before == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
Assertions.assertNotNull(mPreviousText);
|
||||
String newText = s.toString().substring(start, start + count);
|
||||
String oldText = mPreviousText.substring(start, start + before);
|
||||
// Don't send same text changes
|
||||
if (count == before && newText.equals(oldText)) {
|
||||
return;
|
||||
}
|
||||
|
||||
newText = s.toString();
|
||||
//Log.d(REACT_CLASS, "newText: " + newText);
|
||||
registrationMap.put(viewToIdMap.get(mEditText), newText);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void afterTextChanged(Editable s) {
|
||||
}
|
||||
}
|
||||
|
||||
private class SecureReactContentSizeWatcher implements ContentSizeWatcher {
|
||||
private SecureEditText mEditText;
|
||||
private EventDispatcher mEventDispatcher;
|
||||
private int mPreviousContentWidth = 0;
|
||||
private int mPreviousContentHeight = 0;
|
||||
|
||||
public SecureReactContentSizeWatcher(SecureEditText editText) {
|
||||
mEditText = editText;
|
||||
ReactContext reactContext = (ReactContext) editText.getContext();
|
||||
mEventDispatcher = reactContext.getNativeModule(UIManagerModule.class).getEventDispatcher();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void onLayout() {
|
||||
int contentWidth = mEditText.getWidth();
|
||||
int contentHeight = mEditText.getHeight();
|
||||
|
||||
// Use instead size of text content within EditText when available
|
||||
if (mEditText.getLayout() != null) {
|
||||
contentWidth = mEditText.getCompoundPaddingLeft() + mEditText.getLayout().getWidth() +
|
||||
mEditText.getCompoundPaddingRight();
|
||||
contentHeight = mEditText.getCompoundPaddingTop() + mEditText.getLayout().getHeight() +
|
||||
mEditText.getCompoundPaddingBottom();
|
||||
}
|
||||
|
||||
if (contentWidth != mPreviousContentWidth || contentHeight != mPreviousContentHeight) {
|
||||
mPreviousContentHeight = contentHeight;
|
||||
mPreviousContentWidth = contentWidth;
|
||||
|
||||
mEventDispatcher.dispatchEvent(
|
||||
new ReactContentSizeChangedEvent(
|
||||
mEditText.getId(),
|
||||
PixelUtil.toDIPFromPixel(contentWidth),
|
||||
PixelUtil.toDIPFromPixel(contentHeight)));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Override
|
||||
public @Nullable Map<String, Integer> getCommandsMap() {
|
||||
return MapBuilder.of("focusTextInput", FOCUS_TEXT_INPUT, "blurTextInput", BLUR_TEXT_INPUT);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void receiveCommand(
|
||||
SecureEditText reactEditText,
|
||||
int commandId,
|
||||
@Nullable ReadableArray args) {
|
||||
switch (commandId) {
|
||||
case FOCUS_TEXT_INPUT:
|
||||
reactEditText.requestFocusFromJS();
|
||||
break;
|
||||
case BLUR_TEXT_INPUT:
|
||||
reactEditText.clearFocusFromJS();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@Override
|
||||
public void updateExtraData(SecureEditText view, Object extraData) {
|
||||
if (extraData instanceof ReactTextUpdate) {
|
||||
ReactTextUpdate update = (ReactTextUpdate) extraData;
|
||||
|
||||
view.setPadding(
|
||||
(int) update.getPaddingLeft(),
|
||||
(int) update.getPaddingTop(),
|
||||
(int) update.getPaddingRight(),
|
||||
(int) update.getPaddingBottom());
|
||||
|
||||
final String id = viewToIdMap.get(view);
|
||||
final String text = getText(id);
|
||||
view.setText(text);
|
||||
Log.d(REACT_CLASS, "called setText on EditText from updateExtraData with " + text);
|
||||
registrationMap.put(id, text);
|
||||
}
|
||||
}
|
||||
|
||||
@ReactProp(name = "blurOnSubmit")
|
||||
public void setBlurOnSubmit(SecureEditText view, @Nullable Boolean blurOnSubmit) {
|
||||
view.setBlurOnSubmit(blurOnSubmit);
|
||||
}
|
||||
|
||||
@ReactProp(name = "onContentSizeChange", defaultBoolean = false)
|
||||
public void setOnContentSizeChange(final SecureEditText view, boolean onContentSizeChange) {
|
||||
if (onContentSizeChange) {
|
||||
view.setContentSizeWatcher(new SecureReactContentSizeWatcher(view));
|
||||
} else {
|
||||
view.setContentSizeWatcher(null);
|
||||
}
|
||||
}
|
||||
|
||||
@ReactProp(name = "editable", defaultBoolean = true)
|
||||
public void setEditable(SecureEditText view, boolean editable) {
|
||||
view.setEnabled(editable);
|
||||
}
|
||||
|
||||
@ReactProp(name = "multiline", defaultBoolean = false)
|
||||
public void setMultiline(SecureEditText view, boolean multiline) {
|
||||
updateStagedInputTypeFlag(
|
||||
view,
|
||||
multiline ? 0 : InputType.TYPE_TEXT_FLAG_MULTI_LINE,
|
||||
multiline ? InputType.TYPE_TEXT_FLAG_MULTI_LINE : 0);
|
||||
}
|
||||
|
||||
@ReactProp(name = "secureTextEntry", defaultBoolean = false)
|
||||
public void setSecureTextEntry(SecureEditText view, boolean password) {
|
||||
updateStagedInputTypeFlag(
|
||||
view,
|
||||
password ? 0 :
|
||||
InputType.TYPE_NUMBER_VARIATION_PASSWORD | InputType.TYPE_TEXT_VARIATION_PASSWORD,
|
||||
password ? InputType.TYPE_TEXT_VARIATION_PASSWORD : 0);
|
||||
checkPasswordType(view);
|
||||
}
|
||||
|
||||
@ReactProp(name = "keyboardType")
|
||||
public void setKeyboardType(SecureEditText view, @Nullable String keyboardType) {
|
||||
int flagsToSet = InputType.TYPE_CLASS_TEXT;
|
||||
if (KEYBOARD_TYPE_NUMERIC.equalsIgnoreCase(keyboardType)) {
|
||||
flagsToSet = INPUT_TYPE_KEYBOARD_NUMBERED;
|
||||
} else if (KEYBOARD_TYPE_NUMBER_PAD.equalsIgnoreCase(keyboardType)) {
|
||||
flagsToSet = INPUT_TYPE_KEYBOARD_NUMBER_PAD;
|
||||
} else if (KEYBOARD_TYPE_DECIMAL_PAD.equalsIgnoreCase(keyboardType)) {
|
||||
flagsToSet = INPUT_TYPE_KEYBOARD_DECIMAL_PAD;
|
||||
} else if (KEYBOARD_TYPE_EMAIL_ADDRESS.equalsIgnoreCase(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)) {
|
||||
// This will supercede secureTextEntry={false}. If it doesn't, due to the way
|
||||
// the flags work out, the underlying field will end up a URI-type field.
|
||||
flagsToSet = InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD;
|
||||
}
|
||||
updateStagedInputTypeFlag(
|
||||
view,
|
||||
KEYBOARD_TYPE_FLAGS,
|
||||
flagsToSet);
|
||||
checkPasswordType(view);
|
||||
}
|
||||
|
||||
@ReactProp(name = "returnKeyType")
|
||||
public void setReturnKeyType(SecureEditText view, String returnKeyType) {
|
||||
view.setReturnKeyType(returnKeyType);
|
||||
}
|
||||
|
||||
@ReactProp(name = "disableFullscreenUI", defaultBoolean = false)
|
||||
public void setDisableFullscreenUI(SecureEditText view, boolean disableFullscreenUI) {
|
||||
view.setDisableFullscreenUI(disableFullscreenUI);
|
||||
}
|
||||
|
||||
private static final int IME_ACTION_ID = 0x670;
|
||||
|
||||
@ReactProp(name = "returnKeyLabel")
|
||||
public void setReturnKeyLabel(SecureEditText view, String returnKeyLabel) {
|
||||
view.setImeActionLabel(returnKeyLabel, IME_ACTION_ID);
|
||||
}
|
||||
|
||||
@ReactPropGroup(names = {
|
||||
ViewProps.BORDER_RADIUS,
|
||||
ViewProps.BORDER_TOP_LEFT_RADIUS,
|
||||
ViewProps.BORDER_TOP_RIGHT_RADIUS,
|
||||
ViewProps.BORDER_BOTTOM_RIGHT_RADIUS,
|
||||
ViewProps.BORDER_BOTTOM_LEFT_RADIUS
|
||||
}, defaultFloat = YogaConstants.UNDEFINED)
|
||||
public void setBorderRadius(SecureEditText view, int index, float borderRadius) {
|
||||
if (!YogaConstants.isUndefined(borderRadius)) {
|
||||
borderRadius = PixelUtil.toPixelFromDIP(borderRadius);
|
||||
}
|
||||
|
||||
if (index == 0) {
|
||||
view.setBorderRadius(borderRadius);
|
||||
} else {
|
||||
view.setBorderRadius(borderRadius, index - 1);
|
||||
}
|
||||
}
|
||||
|
||||
@ReactProp(name = "borderStyle")
|
||||
public void setBorderStyle(SecureEditText view, @Nullable String borderStyle) {
|
||||
view.setBorderStyle(borderStyle);
|
||||
}
|
||||
|
||||
@ReactPropGroup(names = {
|
||||
ViewProps.BORDER_WIDTH,
|
||||
ViewProps.BORDER_LEFT_WIDTH,
|
||||
ViewProps.BORDER_RIGHT_WIDTH,
|
||||
ViewProps.BORDER_TOP_WIDTH,
|
||||
ViewProps.BORDER_BOTTOM_WIDTH,
|
||||
}, defaultFloat = YogaConstants.UNDEFINED)
|
||||
public void setBorderWidth(SecureEditText view, int index, float width) {
|
||||
if (!YogaConstants.isUndefined(width)) {
|
||||
width = PixelUtil.toPixelFromDIP(width);
|
||||
}
|
||||
view.setBorderWidth(SPACING_TYPES[index], width);
|
||||
}
|
||||
|
||||
@ReactPropGroup(names = {
|
||||
"borderColor", "borderLeftColor", "borderRightColor", "borderTopColor", "borderBottomColor"
|
||||
}, customType = "Color")
|
||||
public void setBorderColor(SecureEditText view, int index, Integer color) {
|
||||
float rgbComponent = color == null ? YogaConstants.UNDEFINED : (float) ((int)color & 0x00FFFFFF);
|
||||
float alphaComponent = color == null ? YogaConstants.UNDEFINED : (float) ((int)color >>> 24);
|
||||
view.setBorderColor(SPACING_TYPES[index], rgbComponent, alphaComponent);
|
||||
}
|
||||
|
||||
@Override
|
||||
protected void onAfterUpdateTransaction(SecureEditText view) {
|
||||
super.onAfterUpdateTransaction(view);
|
||||
view.commitStagedInputType();
|
||||
}
|
||||
|
||||
// Sets the correct password type, since numeric and text passwords have different types
|
||||
private static void checkPasswordType(SecureEditText 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(
|
||||
SecureEditText view,
|
||||
int flagsToUnset,
|
||||
int flagsToSet) {
|
||||
view.setStagedInputType((view.getStagedInputType() & ~flagsToUnset) | flagsToSet);
|
||||
}
|
||||
|
||||
@Override
|
||||
protected final void addEventEmitters(
|
||||
final ThemedReactContext reactContext,
|
||||
final SecureEditText editText) {
|
||||
// editText.setOnEditorActionListener(
|
||||
// new TextView.OnEditorActionListener() {
|
||||
// @Override
|
||||
// public boolean onEditorAction(TextView v, int actionId, KeyEvent keyEvent) {
|
||||
// // Any 'Enter' action will do
|
||||
// if ((actionId & EditorInfo.IME_MASK_ACTION) > 0 ||
|
||||
// actionId == EditorInfo.IME_NULL) {
|
||||
// boolean blurOnSubmit = editText.getBlurOnSubmit();
|
||||
// boolean isMultiline = ((editText.getInputType() &
|
||||
// InputType.TYPE_TEXT_FLAG_MULTI_LINE) != 0);
|
||||
|
||||
// // Motivation:
|
||||
// // * blurOnSubmit && isMultiline => Clear focus; prevent default behaviour (return true);
|
||||
// // * blurOnSubmit && !isMultiline => Clear focus; prevent default behaviour (return true);
|
||||
// // * !blurOnSubmit && isMultiline => Perform default behaviour (return false);
|
||||
// // * !blurOnSubmit && !isMultiline => Prevent default behaviour (return true).
|
||||
|
||||
// if (blurOnSubmit) {
|
||||
// editText.clearFocus();
|
||||
// }
|
||||
|
||||
// // Prevent default behavior except when we want it to insert a newline.
|
||||
// return blurOnSubmit || !isMultiline;
|
||||
// }
|
||||
|
||||
// return true;
|
||||
// }
|
||||
// });
|
||||
}
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user