diff --git a/packages/stack/src/views/Stack/Stack.tsx b/packages/stack/src/views/Stack/Stack.tsx index ff970b94..cf1719cc 100755 --- a/packages/stack/src/views/Stack/Stack.tsx +++ b/packages/stack/src/views/Stack/Stack.tsx @@ -8,7 +8,7 @@ import { ViewProps, } from 'react-native'; import Animated from 'react-native-reanimated'; -import { ScreenContainer, NativeScreen } from 'react-native-screens'; +import * as Screens from 'react-native-screens'; // Import with * as to prevent getters being called import { getDefaultHeaderHeight } from '../Header/HeaderSegment'; import { Props as HeaderContainerProps } from '../Header/HeaderContainer'; import StackItem from './StackItem'; @@ -66,26 +66,41 @@ type State = { const dimensions = Dimensions.get('window'); const layout = { width: dimensions.width, height: dimensions.height }; -const AnimatedScreen = Animated.createAnimatedComponent( - NativeScreen -) as React.ComponentType< +let AnimatedScreen: React.ComponentType< ViewProps & { active: number | Animated.Node } >; -const MaybeScreenContainer = Platform.OS === 'ios' ? View : ScreenContainer; +const MaybeScreenContainer = ({ + enabled, + ...rest +}: ViewProps & { + enabled: boolean; + children: React.ReactNode; +}) => { + if (Platform.OS !== 'ios' && enabled && Screens.screensEnabled()) { + return ; + } + + return ; +}; const MaybeScreen = ({ + enabled, active, ...rest }: ViewProps & { + enabled: boolean; active: number | Animated.Node; children: React.ReactNode; }) => { - if (Platform.OS === 'ios') { - return ; + if (Platform.OS !== 'ios' && enabled && Screens.screensEnabled()) { + AnimatedScreen = + AnimatedScreen || Animated.createAnimatedComponent(Screens.NativeScreen); + + return ; } - return ; + return ; }; const { cond, eq } = Animated; @@ -300,6 +315,7 @@ export default class Stack extends React.Component { return ( @@ -340,6 +356,7 @@ export default class Stack extends React.Component {