fix: disable react-native-screens on iOS

This commit is contained in:
satyajit.happy
2019-07-06 15:24:42 +02:00
parent a41714fa57
commit da7284999b
4 changed files with 33 additions and 17 deletions

View File

@@ -32,7 +32,7 @@ import {
// Comment the following two lines to stop using react-native-screens
import { useScreens } from 'react-native-screens';
useScreens(false);
useScreens(true);
// Change `false` to `true` to force RTL. Requires closing and re-opening
// your app after you first load it with this option enabled.

View File

@@ -11,8 +11,7 @@ Array [
}
}
>
<RNSScreen
active={1}
<View
pointerEvents="box-none"
style={
Object {
@@ -164,8 +163,7 @@ Array [
}
}
>
<RNSScreen
active={1}
<View
pointerEvents="box-none"
style={
Object {
@@ -312,7 +310,7 @@ Array [
</PanGestureHandler>
</View>
</View>
</RNSScreen>
</View>
</View>
<View
pointerEvents="box-none"
@@ -450,7 +448,7 @@ Array [
</PanGestureHandler>
</View>
</View>
</RNSScreen>
</View>
</View>,
<View
pointerEvents="box-none"

View File

@@ -11,8 +11,7 @@ Array [
}
}
>
<RNSScreen
active={1}
<View
pointerEvents="box-none"
style={
Object {
@@ -159,7 +158,7 @@ Array [
</PanGestureHandler>
</View>
</View>
</RNSScreen>
</View>
</View>,
<View
pointerEvents="box-none"
@@ -329,8 +328,7 @@ Array [
}
}
>
<RNSScreen
active={1}
<View
pointerEvents="box-none"
style={
Object {
@@ -477,7 +475,7 @@ Array [
</PanGestureHandler>
</View>
</View>
</RNSScreen>
</View>
</View>,
<View
pointerEvents="box-none"

View File

@@ -1,5 +1,6 @@
import * as React from 'react';
import {
View,
StyleSheet,
LayoutChangeEvent,
Dimensions,
@@ -71,6 +72,22 @@ const AnimatedScreen = Animated.createAnimatedComponent(
ViewProps & { active: number | Animated.Node<number> }
>;
const MaybeScreenContainer = Platform.OS === 'ios' ? View : ScreenContainer;
const MaybeScreen = ({
active,
...rest
}: ViewProps & {
active: number | Animated.Node<number>;
children: React.ReactNode;
}) => {
if (Platform.OS === 'ios') {
return <View {...rest} />;
}
return <AnimatedScreen active={active} {...rest} />;
};
const { cond, eq } = Animated;
const ANIMATED_ONE = new Animated.Value(1);
@@ -220,7 +237,10 @@ export default class Stack extends React.Component<Props, State> {
return (
<React.Fragment>
<ScreenContainer style={styles.container} onLayout={this.handleLayout}>
<MaybeScreenContainer
style={styles.container}
onLayout={this.handleLayout}
>
{routes.map((route, index, self) => {
const focused = focusedRoute.key === route.key;
const current = progress[route.key];
@@ -255,7 +275,7 @@ export default class Stack extends React.Component<Props, State> {
} = descriptor.options;
return (
<AnimatedScreen
<MaybeScreen
key={route.key}
style={StyleSheet.absoluteFill}
active={isScreenActive}
@@ -296,10 +316,10 @@ export default class Stack extends React.Component<Props, State> {
cardStyleInterpolator={cardStyleInterpolator}
headerStyleInterpolator={headerStyleInterpolator}
/>
</AnimatedScreen>
</MaybeScreen>
);
})}
</ScreenContainer>
</MaybeScreenContainer>
{headerMode === 'float'
? renderHeader({
mode: 'float',