FAB.Group Portal: impossible to interact with content exept Fab.Group.

[Djibdjib]

Why Portal Fab.Group is always above of all my content ?

I have put Fab.Group on my page but now, impossible to interact with my content !

Any ideas ? Thx !!

[lukewalczak]

Hye @Djibdjib, please attach the code or create the expo snack illustrating your question / issue.

[Djibdjib]

Here my page:

    <>
      <ScrollView
        contentInsetAdjustmentBehavior="automatic"
        style={styles.sectionContainer}>
        {/* content of my page */}
      </ScrollView>
      <FabGroup />
    </>

Here my Fab Group component

<Provider>
      <Portal>
        <FAB.Group
          open={open}
          visible
          icon={open ? 'home' : 'plus'}
          style={{ backgroundColor: 'red', paddingBottom: 50 }}
          actions={[
            {
              icon: 'plus',
              onPress: () => console.log('Pressed add'),
              style: styles.button,
            },
            {
              icon: 'star',
              label: 'Star',
              onPress: () => console.log('Pressed star'),
              style: styles.button,
            },
            {
              icon: 'email',
              label: 'Email',
              onPress: () => console.log('Pressed email'),
              style: styles.button,
            },
            {
              icon: 'bell',
              label: 'Remind',
              onPress: () => console.log('Pressed notifications'),
              style: styles.button,
            },
          ]}
          onStateChange={onStateChange}
          onPress={() => {
            if (open) {
              // do something if the speed dial is open
            }
          }}
        />
      </Portal>
    </Provider>

When i use Portal.Host, it's good because i can click on my page. But if i have a lot of content, my Fab.Group disappear. I want fab group fixed on my page (with Portal, not Portal.Host) !

Regards

[lukewalczak]

Hey @Djibdjib, please check the following snack, I hope it will be helpful.

[Djibdjib]

Woaw ! thx a lot ! it's working perfectly !

Best regards,
Djib