Skip to content

Commit 6ca7ce2

Browse files
Leonardoalvaromb
authored andcommitted
Add support to subscribe to keyboard events (#165)
This commit is not strictly necessary, once lib users can make their own subscribe to `Keyboard` events. On the other hand, this helps everything related to keyboard to be on the same place. Also, this commit makes the lib compliant with its documentation, which state that `onKeyboardWillShow` is a possible prop for the component.
1 parent ce6e338 commit 6ca7ce2

File tree

1 file changed

+35
-3
lines changed

1 file changed

+35
-3
lines changed

lib/KeyboardAwareHOC.js

Lines changed: 35 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,34 @@ import ReactNative, {
1111
Animated
1212
} from 'react-native'
1313
import { isIphoneX } from 'react-native-iphone-x-helper'
14-
1514
import type { KeyboardAwareInterface } from './KeyboardAwareInterface'
1615

1716
const _KAM_DEFAULT_TAB_BAR_HEIGHT: number = isIphoneX() ? 83 : 49
1817
const _KAM_KEYBOARD_OPENING_TIME: number = 250
1918
const _KAM_EXTRA_HEIGHT: number = 75
2019

20+
const supportedKeyboardEvents = [
21+
'keyboardWillShow',
22+
'keyboardDidShow',
23+
'keyboardWillHide',
24+
'keyboardDidHide',
25+
'keyboardWillChangeFrame',
26+
'keyboardDidChangeFrame',
27+
]
28+
const keyboardEventToCallbackName = (eventName: string) => (
29+
'on' + eventName[0].toUpperCase() + eventName.substring(1)
30+
)
31+
const keyboardEventPropTypes = supportedKeyboardEvents.reduce(
32+
(acc: Object, eventName: string) => (
33+
{ ...acc, [keyboardEventToCallbackName(eventName)]: PropTypes.func }
34+
), {}
35+
)
36+
const keyboardAwareHOCTypeEvents = supportedKeyboardEvents.reduce(
37+
(acc: Object, eventName: string) => (
38+
{ ...acc, [keyboardEventToCallbackName(eventName)]: Function }
39+
), {}
40+
)
41+
2142
export type KeyboardAwareHOCProps = {
2243
viewIsInsideTabBar?: boolean,
2344
resetScrollToCoords?: {
@@ -33,7 +54,8 @@ export type KeyboardAwareHOCProps = {
3354
update?: Function,
3455
contentContainerStyle?: any,
3556
enableOnAndroid?: boolean,
36-
innerRef?: Function
57+
innerRef?: Function,
58+
...keyboardAwareHOCTypeEvents
3759
}
3860
export type KeyboardAwareHOCState = {
3961
keyboardSpace: number
@@ -100,7 +122,8 @@ function listenToKeyboardEvents(ScrollableComponent: React$Component) {
100122
update: PropTypes.func,
101123
contentContainerStyle: PropTypes.any,
102124
enableOnAndroid: PropTypes.bool,
103-
innerRef: PropTypes.func
125+
innerRef: PropTypes.func,
126+
...keyboardEventPropTypes
104127
}
105128

106129
static defaultProps = {
@@ -116,6 +139,7 @@ function listenToKeyboardEvents(ScrollableComponent: React$Component) {
116139
super(props)
117140
this.keyboardWillShowEvent = undefined
118141
this.keyboardWillHideEvent = undefined
142+
this.callbacks = {}
119143
this.position = { x: 0, y: 0 }
120144
this.defaultResetScrollToCoords = null
121145
const keyboardSpace: number = props.viewIsInsideTabBar
@@ -146,6 +170,13 @@ function listenToKeyboardEvents(ScrollableComponent: React$Component) {
146170
this._resetKeyboardSpace
147171
)
148172
}
173+
174+
supportedKeyboardEvents.forEach((eventName: string) => {
175+
const callbackName = keyboardEventToCallbackName(eventName)
176+
if (this.props[callbackName]) {
177+
this.callbacks[eventName] = Keyboard.addListener(eventName, this.props[callbackName])
178+
}
179+
})
149180
}
150181

151182
componentWillReceiveProps(nextProps: KeyboardAwareHOCProps) {
@@ -163,6 +194,7 @@ function listenToKeyboardEvents(ScrollableComponent: React$Component) {
163194
this.mountedComponent = false
164195
this.keyboardWillShowEvent && this.keyboardWillShowEvent.remove()
165196
this.keyboardWillHideEvent && this.keyboardWillHideEvent.remove()
197+
Object.values(this.callbacks).forEach((callback: Object) => callback.remove())
166198
}
167199

168200
getScrollResponder = () => {

0 commit comments

Comments
 (0)