Way to pass styles to nested view

Summary:
Ability to pass styles to nested view for _position_ behavior.

Use case:

``` jsx
<KeyboardAvoidingView
          behavior={'position'}
          style={{ flex: 1 }}
          contentContainerStyle={{ flex: 1 }}
          keyboardVerticalOffset={ - VERTICAL_OFFSET }
>
          <SomeContainer   />
</KeyboardAvoidingView>
```
Closes https://github.com/facebook/react-native/pull/9065

Differential Revision: D3662876

Pulled By: javache

fbshipit-source-id: 9b08a04449431c4e563ef4464b5a7dba1fc02e4b
This commit is contained in:
Slavik Manukyan 2016-08-03 11:14:48 -07:00 committed by Facebook Github Bot 5
parent 504b516947
commit 54d8f221c2
1 changed files with 9 additions and 2 deletions

View File

@ -54,6 +54,11 @@ const KeyboardAvoidingView = React.createClass({
...View.propTypes, ...View.propTypes,
behavior: PropTypes.oneOf(['height', 'position', 'padding']), behavior: PropTypes.oneOf(['height', 'position', 'padding']),
/**
* The style of the content container(View) when behavior is 'position'.
*/
contentContainerStyle: View.propTypes.style,
/** /**
* This is the distance between the top of the user screen and the react native view, * This is the distance between the top of the user screen and the react native view,
* may be non-zero in some use cases. * may be non-zero in some use cases.
@ -160,9 +165,11 @@ const KeyboardAvoidingView = React.createClass({
case 'position': case 'position':
const positionStyle = {bottom: this.state.bottom}; const positionStyle = {bottom: this.state.bottom};
const { contentContainerStyle } = this.props;
return ( return (
<View ref={viewRef} style={style} onLayout={this.onLayout} {...props}> <View ref={viewRef} style={style} onLayout={this.onLayout} {...props}>
<View style={positionStyle}> <View style={[contentContainerStyle, positionStyle]}>
{children} {children}
</View> </View>
</View> </View>