1

I've this tab navigator:

<Tab.Navigator tabBar={babyPlayer} />

Inside the baby player i'm using a pan gesture from react native gesture handler and so I need to wrap the tab bar with gestureHandlerRootHOC and i'm doing it like so:

export const babyPlayer = gestureHandlerRootHOC( (props: BottomTabBarProps) => <BabyPlayer {...props} />, { position: 'absolute', bottom: 0, left: 0, right: 0, top: 0, }, );

Here comes the problem, this component is on top of any screen inside the tab navigator so I cannot click nothing on the screens, but I've found a solution: I've recreated the gesturehandlerroothoc and I've added to it a pointerEvents props and set it to box-none.

On ios it's working and I've tested it for more than 3 months, but now I've tried to make the app compatible with android, and I've seen that the pointerEvents doesn't work on android. Anyone have experienced something like this or could suggest me a different approach to do that?

0 Answers0