react-native-actions-sheet
react-native-actions-sheet copied to clipboard
SheetManager doesn't seem to work with New Architecture enabled.
I recently enabled new architecture and whenever I try to present sheets via the SheetManager, they just don't show up. I see the transparent black background appear but no sheet renders, no matter what style I give it, e.g.:
<ActionSheet
containerStyle={{
backgroundColor: 'blue',
height: 400,
alignItems: 'center',
justifyContent: 'center',
}}
>
Using ActionSheets directly within components still works.
It seems that if I make isModal={false} things work again.
I encountered this issue as well. This problem didn’t exist when I used the package a year ago. I resolved it by setting isModal={false}. It seems to be related to using react-native-actions-sheet alongside react-native-reanimated. See #391 and #337
@ammarahm-ed please look into this when you have a chance, I had all my action sheets break on Android after upgrading to the new Expo SDK (which enables new architecture by default).
I've noticed that some of my action sheets work fine without isModal={false} (and actually break when I put that on them) - these are action sheets that are called by a parent component that is rendered with a scrollview; maybe it's something to do with reanimated acting on some of the views and not others? not sure, but happy to debug some more if you need.
same issue. broken on Android with New Architecture enabled.
+1. Any updates on this?
I'm having the same issue in Android with new arch enabled as well. I did the upgrade from expo 51 (where everything was working fine) and then the sheets stopped working properly.
I think my issue mainly is related with absolute-positioned elements. I happen to be working in a map view and rendering absolute-positioned controls makes the sheet to appear "off screen". I can see part of it but it also is sort of broken, it is not even the complete sheet.
It can be barely seen in one of the corners of my device:
If I remove my absolute positioned elements the sheet would just show fine.
The workaround isModal={ false } is working for me though.
I tried to create a repro repo but wasn't able. Took all the examples from here and moved them into an expo 52 new project and added some absolutely positioned elements but the sheet worked so it is very confusing for me what the conditions are for reproducing it
@lakardion Because, this package has some issues with the new architecture, which is enabled by default in Expo 52
+1
Hey, we had an issue with ActionSheet component doesn't show up (same as default Modal from RN new arch). After searching for solutions we found out that simple wrapping into View helps. We are not sure why and how but now everything works fine. I hope it will help to someone.
Fix example:
<View>
<ActionSheet {...any props}>
{children}
</ActionSheet>
</View>
Having similar issue
Fixed with either
- isModal={false}
- Wrapping into View
Same issue here... action sheet does not show up.
Neither isModal={false} nor Wrapping into View have worked for me.
Hey, we had an issue with
ActionSheetcomponent doesn't show up (same as default Modal from RN new arch). After searching for solutions we found out that simple wrapping intoViewhelps. We are not sure why and how but now everything works fine. I hope it will help to someone.Fix example:
<View> <ActionSheet {...any props}> {children} </ActionSheet> </View>
thank you @igorkirnbb this works with me
Import your root Sheets.tsx file (in my case) in your root app.tsx component.
import './app/components/ActionSheets/Sheets';
const App = ()=> { return ( <SheetProvider> <View> </View> </SheetProvider> ) }