CODEWITHSUNDEEP
javascriptreact-nativereact-native-iosreact-native-popup-menu
FreakyCoder
FreakyCoder

Reputation: 869

React-Native-Popup-Menu with FloatingActionButton Component cannot trigger with MenuTrigger

I would like to use react-native-popup-menu and react-native-floating-action-button components together. I've tried : 

<MenuTrigger>
    <FloatingActionButton
        size={56}
        textDisable
        iconName="directions"
        iconType="material-icons"
        shadowColor="#000"
        iconColor="white"
        backgroundColor="#405914"
    />
</MenuTrigger>

This code does not trigger the MenuTrigger because FloatingActionButton's onPress is triggered.

I also tried this kinds of stuff :

<MenuTrigger customStyles={{ TriggerTouchableComponent: FloatingActionButton }} />

This one's trigger is working with MenuTrigger but I cannot customize the FAB button's styling.

Can you provide me a solution ? :)

Thank you

Upvotes: 3

Views: 1633

Answers (2)

Nick Charney Kaye
Nick Charney Kaye

Reputation: 4340

Using react-native-popup-menu version 0.15.12 I am able now to achieve this with

<MenuTrigger>
  <MyCustomButtonComponent>
    <Icon ...>
  </MyCustomButtonComponent>
</MenuTrigger>

Upvotes: 0

sodik
sodik

Reputation: 4683

According to doc you could use triggerTouchable. 

      <MenuTrigger
        customStyles={{
          TriggerTouchableComponent: Button,
          triggerTouchable: { title: 'Select (Custom Touchables)' },
        }}
      />

Upvotes: 2

Related Questions