Menu not visible on Android when used with React Navigation transparent header

[adorum]

Description:

When using @react-native-menu/menu inside a react-navigation transparent header, the menu does not appear on Android. The button is rendered and press events are registered, but the menu is never shown.

This issue only happens on Android. On iOS, the menu works as expected even with a transparent header.

Steps to Reproduce:

Create a React Navigation stack screen with headerTransparent: true.
Place a

inside the header (or a component rendered inside the headerRight).

Run the app on Android.

Tap the menu trigger.

Expected Behavior:

The menu should be displayed over the transparent header, same as on iOS.

Actual Behavior:

On Android, the menu does not appear at all when the header is transparent.

Reproducible Example:

import {MenuView} from '@react-native-menu/menu'
import {NavigationContainer} from '@react-navigation/native'
import {createStackNavigator} from '@react-navigation/stack'
import * as React from 'react'
import {Button, View} from 'react-native'

const Stack = createStackNavigator()

export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen
          name="Home"
          component={View}
          options={{
            headerTransparent: true,
            headerRight: () => (
              <MenuView
                title="Options"
                actions={[
                  {id: '1', title: 'Item 1'},
                  {id: '2', title: 'Item 2'},
                ]}
                onPressAction={({nativeEvent}) => console.log(nativeEvent)}
              >
                <Button title="Open Menu" onPress={() => {}} />
              </MenuView>
            ),
          }}
        />
      </Stack.Navigator>
    </NavigationContainer>
  )
}

[vjdev1212]

@adorum Did you find a workaround?