grabbou / react-native-recipes

A curated list of React Native (not-only) recipes to boost your app
19 stars 0 forks source link

Example of adjusting views along on-screen keyboard #2

Open grabbou opened 9 years ago

grabbou commented 9 years ago

Hiding certain elements so keyboard does not covers inputs etc.

browniefed commented 9 years ago
DeviceEventEmitter.addListener('keyboardWillShow', function (frames) {
    LayoutAnimation.configureNext(LayoutAnimation.create(frames.duration, 'keyboard'));
    this.setState({keyboardSpace: frames.endCoordinates.height});
}.bind(this));

<View style={{height: this.state.keyboardSpace}}></View>
grabbou commented 9 years ago

+1, or with Animated as per my Slack gist :)

browniefed commented 9 years ago

Don't forget to remove the listener when you don't need it anymore!