zeego: [Android] DropdownMenu not working

Hello! Thanks for this cool library!

We just tried a small snippet from the example project and found that it only works on iOS (and maybe web), but on Android, nothing is being shown when I tap on the Trigger. I this a known issue because I see that Android is supported from the documentation? Thank you!

Repro

 <DropdownMenu.Root key={filter}>
    <DropdownMenu.Trigger>
      <ThemedChip
        key={filter}
        isSelected
        label={filter}
        style={tw('mx-2 my-2')}
        rightComponent={
          <ThemedIcon
            name="x"
            color="white"
            size={16}
            style={tw('ml-1')}
          />
        }
        // onPress={() => removeFilter(filter)}
      />
    </DropdownMenu.Trigger>
    <DropdownMenu.Content
      style={{
        minWidth: 220,
        backgroundColor: 'white',
        borderRadius: 6,
        padding: 5,
        borderWidth: 1,
        borderColor: '#fff8',
      }}
    >
      <DropdownMenuLabel>Help</DropdownMenuLabel>

      {[1, 2, 3].map(i => (
        <DropdownMenuItem key={`list-${i}`}>
          <DropdownMenuItemTitle>{`Item ${i}`}</DropdownMenuItemTitle>
        </DropdownMenuItem>
      ))}
    </DropdownMenu.Content>
  </DropdownMenu.Root>

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 16 (9 by maintainers)

Most upvoted comments

@thespacemanatee can you remove Pressable from ThemedChip and just use a View? Zeego also adds a Pressable on Trigger (on Android) so it won’t work well with your Pressable. I am working on adding a native menu for android, which will solve it in the future.

The Android native menu is now live in version 0.4.0. It requires installing @react-native-menu/menu.

Shout out to @intergalacticspacehighway for the #6 PR

Thank you guys for the informative discussion, and since there isn’t an ‘issue’ with the Android implementation and a better implementation is coming up, feel free to close this issue! 😃

Yeah, there is some magic going on here for Android. Under the hood, it’s cloning the child and passing down a ref.

It first extracts the Trigger child here: https://github.com/nandorojo/zeego/blob/master/packages/zeego/src/menu/create-android-menu/index.android.tsx#L119

Update: now that I’m looking at it again, I don’t think forward ref should be necessary, since we’re measuring the Pressable: https://github.com/nandorojo/zeego/blob/master/packages/zeego/src/menu/create-android-menu/index.android.tsx#L149-L156

So the only thing that really matters is not using a Pressable I believe. This will be fixed when we move to a native menu.