Skip to content

Instantly share code, notes, and snippets.

@Yassir4
Last active March 22, 2022 19:15
Show Gist options
  • Save Yassir4/efafd25708866a2ce2ff570959ed8402 to your computer and use it in GitHub Desktop.
Save Yassir4/efafd25708866a2ce2ff570959ed8402 to your computer and use it in GitHub Desktop.
calculating the menu position in the screen
const { top, left } = useMemo(() => {
let left = 0;
let top = 0;
left =
triggerDimensions.left - modalDimensions.width + triggerDimensions.width;
// if the popup is outside the screen from the left
if (triggerDimensions.left - modalDimensions.width < 0)
left = triggerDimensions.left;
if (isIOS) {
const initialTriggerTop =
triggerDimensions.top + triggerDimensions.height + 10;
if (
modalDimensions.height + initialTriggerTop >
layoutHeight - keyboardHeight
)
top = triggerDimensions.top - modalDimensions.height - 10;
else top = initialTriggerTop;
} else {
const initialTriggerTop =
triggerDimensions.top +
triggerDimensions.height +
StatusBar.currentHeight;
top =
initialTriggerTop + modalDimensions.height >
layoutHeight - keyboardHeight
? initialTriggerTop -
triggerDimensions.height -
modalDimensions.height
: initialTriggerTop;
}
return { top, left };
}, [modalDimensions, triggerDimensions, keyboardHeight]);
const menuPositionStyles = { left, top };
return (
<View
style={[styles.activeSection, menuPositionStyles]}
collapsable={false}
ref={itemsWrapperRef}
>
{/* children */}
</View>
)
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment