react-native/website/versioned_docs/0.41/keyboard.md

id, title, original_id

id	title	original_id
version-0.41-keyboard	keyboard	keyboard

Keyboard #

Keyboard module to control keyboard events.

Usage #

The Keyboard module allows you to listen for native events and react to them, as well as make changes to the keyboard, like dismissing it.

import React, { Component } from 'react'; import { Keyboard, TextInput } from 'react-native';

class Example extends Component { componentWillMount () { this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', this._keyboardDidShow); this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide); }

componentWillUnmount () { this.keyboardDidShowListener.remove(); this.keyboardDidHideListener.remove(); }

_keyboardDidShow () { alert('Keyboard Shown'); }

_keyboardDidHide () { alert('Keyboard Hidden'); }

render() { return ( <TextInput onSubmitEditing={Keyboard.dismiss} /> ); } }

Methods #

static addListener(eventName, callback) #

The addListener function connects a JavaScript function to an identified native keyboard notification event.

This function then returns the reference to the listener.

@param {string} eventName The nativeEvent is the string that identifies the event you're listening for. This can be any of the following:

• keyboardWillShow
• keyboardDidShow
• keyboardWillHide
• keyboardDidHide
• keyboardWillChangeFrame
• keyboardDidChangeFrame

@param {function} callback function to be called when the event fires.

static removeListener(eventName, callback) #

Removes a specific listener.

@param {string} eventName The nativeEvent is the string that identifies the event you're listening for. @param {function} callback function to be called when the event fires.

static removeAllListeners(eventName) #

Removes all listeners for a specific event type.

@param {string} eventType The native event string listeners are watching which will be removed.

static dismiss(0) #

Dismisses the active keyboard and removes focus.

You can edit the content above on GitHub and send us a pull request!

← PrevNext →