Updates from Mon 30 Mar

- [ReactNative] Clean up no longer needed reference to NavigationBarClass | Philipp von Weitershausen
- [TextInput] returnKeyType, enablesReturnKeyAutomatically, secureTextEntry, more keyboardTypes | Tadeu Zagallo
- [ReactNative] PropTypes for NavigationBars | Philipp von Weitershausen
- Changed LayoutAnimation to use ms instead of seconds for consistency | Nick Lockwood
- Better date support | Nick Lockwood
- Renamed throttleScrollCallbackMS to scrollEventThrottle | Nick Lockwood
- Fixed threading issues in RCTImageDownloader | Nick Lockwood
- [iOS][Assets]: Cleaning up more 1x png from Libraries | Radu Marin
- [ReactNative][docs] LinkingIOS | Tadeu Zagallo
- Fixing TouchableOpacity and TouchableHighlight documentation | Ben Alpert
- [react-native] Add React.addons.createFragment | Ben Alpert
This commit is contained in:
Christopher Chedeau
2015-03-30 20:12:32 -07:00
parent 02298b59e2
commit 9a4ee17adb
49 changed files with 904 additions and 288 deletions

View File

@@ -15,6 +15,7 @@ var DocumentSelectionState = require('DocumentSelectionState');
var EventEmitter = require('EventEmitter');
var NativeMethodsMixin = require('NativeMethodsMixin');
var RCTUIManager = require('NativeModules').UIManager;
var Platform = require('Platform');
var PropTypes = require('ReactPropTypes');
var React = require('React');
var ReactChildren = require('ReactChildren');
@@ -27,12 +28,12 @@ var TouchableWithoutFeedback = require('TouchableWithoutFeedback');
var createReactIOSNativeComponentClass = require('createReactIOSNativeComponentClass');
var emptyFunction = require('emptyFunction');
var getObjectValues = require('getObjectValues');
var invariant = require('invariant');
var merge = require('merge');
var autoCapitalizeConsts = RCTUIManager.UIText.AutocapitalizationType;
var clearButtonModeConsts = RCTUIManager.UITextField.clearButtonMode;
var keyboardTypeConsts = RCTUIManager.UIKeyboardType;
var returnKeyTypeConsts = RCTUIManager.UIReturnKeyType;
var RCTTextViewAttributes = merge(ReactIOSViewAttributes.UIView, {
autoCorrect: true,
@@ -44,6 +45,9 @@ var RCTTextViewAttributes = merge(ReactIOSViewAttributes.UIView, {
fontStyle: true,
fontWeight: true,
keyboardType: true,
returnKeyType: true,
enablesReturnKeyAutomatically: true,
secureTextEntry: true,
mostRecentEventCounter: true,
placeholder: true,
placeholderTextColor: true,
@@ -66,6 +70,27 @@ var notMultiline = {
onSubmitEditing: true,
};
var TextInputAndroidAttributes = {
autoCapitalize: true,
autoCorrect: true,
autoFocus: true,
keyboardType: true,
multiline: true,
password: true,
placeholder: true,
value: true,
testID: true,
};
var AndroidTextInput = createReactIOSNativeComponentClass({
validAttributes: TextInputAndroidAttributes,
uiViewClassName: 'AndroidTextInput',
});
var crossPlatformKeyboardTypeMap = {
'numeric': 'decimal-pad',
};
type DefaultProps = {
bufferDelay: number;
};
@@ -138,8 +163,47 @@ var TextInput = React.createClass({
*/
keyboardType: PropTypes.oneOf([
'default',
// iOS
'ascii-capable',
'numbers-and-punctuation',
'url',
'number-pad',
'phone-pad',
'name-phone-pad',
'email-address',
'decimal-pad',
'twitter',
'web-search',
// Cross-platform
'numeric',
]),
/**
* Determines how the return key should look.
*/
returnKeyType: PropTypes.oneOf([
'default',
'go',
'google',
'join',
'next',
'route',
'search',
'send',
'yahoo',
'done',
'emergency-call',
]),
/**
* If true, the keyboard disables the return key when there is no text and
* automatically enables it when there is text. Default value is false.
*/
enablesReturnKeyAutomatically: PropTypes.bool,
/**
* If true, the text input obscures the text entered so that sensitive text
* like passwords stay secure. Default value is false.
*/
secureTextEntry: PropTypes.bool,
/**
* If true, the text input can be multiple lines. Default value is false.
*/
@@ -157,10 +221,15 @@ var TextInput = React.createClass({
*
* Callback that is called when the text input's text changes.
*/
onChange: PropTypes.func,
onChangeText: PropTypes.func,
onEndEditing: PropTypes.func,
onSubmitEditing: PropTypes.func,
/**
* If true, the TextInput will be a password field. Default value is false.
*/
password: PropTypes.bool,
/**
* The string that will be rendered before text input has been entered
*/
@@ -202,6 +271,10 @@ var TextInput = React.createClass({
]),
style: Text.propTypes.style,
/**
* Used to locate this view in end-to-end tests.
*/
testID: PropTypes.string,
},
/**
@@ -313,10 +386,24 @@ var TextInput = React.createClass({
},
render: function() {
if (Platform.OS === 'ios') {
return this._renderIOs();
} else if (Platform.OS === 'android') {
return this._renderAndroid();
}
},
_renderIOs: function() {
var textContainer;
var autoCapitalize = autoCapitalizeConsts[this.props.autoCapitalize];
var clearButtonMode = clearButtonModeConsts[this.props.clearButtonMode];
var clearButtonMode = RCTUIManager.UITextField.clearButtonMode[this.props.clearButtonMode];
var keyboardType = keyboardTypeConsts[
crossPlatformKeyboardTypeMap[this.props.keyboardType] ||
this.props.keyboardType
];
var returnKeyType = returnKeyTypeConsts[this.props.returnKeyType];
if (!this.props.multiline) {
for (var propKey in onlyMultiline) {
@@ -331,7 +418,10 @@ var TextInput = React.createClass({
ref="input"
style={[styles.input, this.props.style]}
enabled={this.props.editable}
keyboardType={this.props.keyboardType}
keyboardType={keyboardType}
returnKeyType={returnKeyType}
enablesReturnKeyAutomatically={this.props.enablesReturnKeyAutomatically}
secureTextEntry={this.props.secureTextEntry}
onFocus={this._onFocus}
onBlur={this._onBlur}
onChange={this._onChange}
@@ -373,6 +463,10 @@ var TextInput = React.createClass({
children={children}
mostRecentEventCounter={this.state.mostRecentEventCounter}
editable={this.props.editable}
keyboardType={keyboardType}
returnKeyType={returnKeyType}
enablesReturnKeyAutomatically={this.props.enablesReturnKeyAutomatically}
secureTextEntry={this.props.secureTextEntry}
onFocus={this._onFocus}
onBlur={this._onBlur}
onChange={this._onChange}
@@ -398,6 +492,27 @@ var TextInput = React.createClass({
);
},
_renderAndroid: function() {
var autoCapitalize = autoCapitalizeConsts[this.props.autoCapitalize];
return (
<AndroidTextInput
ref="input"
style={[this.props.style]}
autoCapitalize={autoCapitalize}
autoCorrect={this.props.autoCorrect}
keyboardType={this.props.keyboardType}
multiline={this.props.multiline}
onFocus={this._onFocus}
onBlur={this._onBlur}
onChange={this._onChange}
password={this.props.password}
placeholder={this.props.placeholder}
value={this.props.value}
testID={this.props.testID}
/>
);
},
_onFocus: function(event: Event) {
if (this.props.onFocus) {
this.props.onFocus(event);