status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-23 14:48:25 +00:00
Code Issues Projects Releases Wiki Activity

Make KeyboardAvoidingView with behavior="height" resize on keyboard close (#18889)

Browse Source 
Summary:
<!--
  Required: Write your motivation here.
  If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->
Fixes #13754
Pull Request resolved: https://github.com/facebook/react-native/pull/18889

Differential Revision: D14486115

Pulled By: PeteTheHeat

fbshipit-source-id: 7b8b4fa9d2c99fc5d6145fed4681afdc4bb14fb8
This commit is contained in:
Achille Urbain 2019-03-22 15:01:56 -07:00 committed by Mike Grabowski
parent 0c420644d9
commit 7140a7f7d1
1 changed files with 6 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
Libraries/Components/Keyboard/KeyboardAvoidingView.js
View File

@ -65,6 +65,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
_frame: ?ViewLayout = null;
_subscriptions: Array<EmitterSubscription> = [];
viewRef: {current: React.ElementRef<any> | null};
_initialFrameHeight: number = 0;
constructor(props: Props) {
super(props);
@ -113,19 +114,11 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
_onLayout = (event: ViewLayoutEvent) => {
this._frame = event.nativeEvent.layout;
};
UNSAFE_componentWillUpdate(nextProps: Props, nextState: State): void {
if (
nextState.bottom === this.state.bottom &&
this.props.behavior === 'height' &&
nextProps.behavior === 'height'
) {
// If the component rerenders without an internal state change, e.g.
// triggered by parent component re-rendering, no need for bottom to change.
nextState.bottom = 0;
if (!this._initialFrameHeight) {
// save the initial frame height, before the keyboard is visible
this._initialFrameHeight = this._frame.height;
}
}
};
componentDidMount(): void {
if (Platform.OS === 'ios') {
@ -166,7 +159,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
// this.frame.height will never go back to its original value.
// When height changes, we need to disable flex.
heightStyle = {
height: this._frame.height - bottomHeight,
height: this._initialFrameHeight - bottomHeight,
flex: 0,
};
}