State to check whether the sheet is open or not #1338
Unanswered
bryanltobing
asked this question in
Q&A
Replies: 2 comments 1 reply
-
have you figured that out? @bryanltobing |
Beta Was this translation helpful? Give feedback.
0 replies
-
I use this hook to work out when the height of the bottom sheet passes a certain boundary: import { useBottomSheet } from '@gorhom/bottom-sheet'
import { useState } from 'react'
import { Dimensions } from 'react-native'
import { runOnJS, useAnimatedReaction } from 'react-native-reanimated'
const windowHeight = Dimensions.get('window').height
export function useBottomSheetBoundary (boundary: number) {
const { animatedPosition } = useBottomSheet()
const [isBelowBoundary, setIsBelowBoundary] = useState(true)
useAnimatedReaction(
() => windowHeight - animatedPosition.value,
(estimatedHeight, previous) => {
if (estimatedHeight < (previous ?? 0) && estimatedHeight < boundary) {
runOnJS(setIsBelowBoundary)(true)
} else if (estimatedHeight > (previous ?? 0) && estimatedHeight > boundary) {
runOnJS(setIsBelowBoundary)(false)
}
}
)
return isBelowBoundary ? 'below' : 'above'
} |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
As we know if we use
BottomSheet
. The content inside it will be rendered immediately.I want to improve the performance of my screen by lazy loading content inside the
BottomSheet
.Is there a way to do this the right way?
Beta Was this translation helpful? Give feedback.
All reactions