src/components/KeyboardPadding.android.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

import React from 'react'
import {useKeyboardHandler} from 'react-native-keyboard-controller'
import Animated, {
  useAnimatedStyle,
  useSharedValue,
} from 'react-native-reanimated'

export function KeyboardPadding({maxHeight}: {maxHeight?: number}) {
  const keyboardHeight = useSharedValue(0)

  useKeyboardHandler(
    {
      onMove: e => {
        'worklet'

        if (maxHeight && e.height > maxHeight) {
          keyboardHeight.value = maxHeight
        } else {
          keyboardHeight.value = e.height
        }
      },
    },
    [maxHeight],
  )

  const animatedStyle = useAnimatedStyle(() => ({
    height: keyboardHeight.value,
  }))

  return <Animated.View style={animatedStyle} />
}