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

@ -53,7 +53,12 @@ const KeyboardAvoidingView = React.createClass({
propTypes: {
...View.propTypes,
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,
* may be non-zero in some use cases.
@ -160,9 +165,11 @@ const KeyboardAvoidingView = React.createClass({
case 'position':
const positionStyle = {bottom: this.state.bottom};
const { contentContainerStyle } = this.props;
return (
<View ref={viewRef} style={style} onLayout={this.onLayout} {...props}>
<View style={positionStyle}>
<View style={[contentContainerStyle, positionStyle]}>
{children}
</View>
</View>