kylefang/react-navigation
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-navigation.git synced 2026-03-26 09:14:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: drop support for older versions of react-native-screens

Browse Source
This commit is contained in:
Satyajit Sahoo
2021-05-09 06:03:38 +02:00
parent 6866ad2cda
commit 8f2b95ca97
4 changed files with 31 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
packages/stack/src/views/Screens.tsx
View File

@@ -9,8 +9,6 @@ try {
// Ignore
}
export const shouldUseActivityState = Screens?.shouldUseActivityState;
// So we use our custom implementation to handle a11y better
class WebScreen extends React.Component<
ViewProps & {
@@ -65,13 +63,9 @@ export const MaybeScreen = ({
}
if (enabled && Screens?.screensEnabled()) {
if (shouldUseActivityState) {
return (
<Screens.Screen enabled={enabled} activityState={active} {...rest} />
);
} else {
return <Screens.Screen enabled={enabled} active={active} {...rest} />;
}
return (
<Screens.Screen enabled={enabled} activityState={active} {...rest} />
);
}
return <View {...rest} />;

48
packages/stack/src/views/Stack/CardStack.tsx
View File

@@ -18,11 +18,7 @@ import {
Background,
} from '@react-navigation/elements';
import {
MaybeScreenContainer,
MaybeScreen,
shouldUseActivityState,
} from '../Screens';
import { MaybeScreenContainer, MaybeScreen } from '../Screens';
import type { Props as HeaderContainerProps } from '../Header/HeaderContainer';
import CardContainer from './CardContainer';
import {
@@ -467,9 +463,7 @@ export default class CardStack extends React.Component<Props, State> {
onGestureCancel,
// Enable on new versions of `react-native-screens`
// On older versions of `react-native-screens`, there's an issue with screens not being responsive to user interaction.
detachInactiveScreens = Platform.OS === 'web'
? true
: shouldUseActivityState ?? false,
detachInactiveScreens = true,
} = this.props;
const { scenes, layout, gestures, headerHeights } = this.state;
@@ -551,34 +545,24 @@ export default class CardStack extends React.Component<Props, State> {
// For the old implementation, it stays the same it was
let isScreenActive: Animated.AnimatedInterpolation | 2 | 1 | 0 = 1;
if (shouldUseActivityState || Platform.OS === 'web') {
if (index < self.length - activeScreensLimit - 1) {
// screen should be inactive because it is too deep in the stack
isScreenActive = STATE_INACTIVE;
} else {
const sceneForActivity = scenes[self.length - 1];
const outputValue =
index === self.length - 1
? STATE_ON_TOP // the screen is on top after the transition
: index >= self.length - activeScreensLimit
? STATE_TRANSITIONING_OR_BELOW_TOP // the screen should stay active after the transition, it is not on top but is in activeLimit
: STATE_INACTIVE; // the screen should be active only during the transition, it is at the edge of activeLimit
isScreenActive = sceneForActivity
? sceneForActivity.progress.current.interpolate({
inputRange: [0, 1 - EPSILON, 1],
outputRange: [1, 1, outputValue],
extrapolate: 'clamp',
})
: STATE_TRANSITIONING_OR_BELOW_TOP;
}
if (index < self.length - activeScreensLimit - 1) {
// screen should be inactive because it is too deep in the stack
isScreenActive = STATE_INACTIVE;
} else {
isScreenActive = scene.progress.next
? scene.progress.next.interpolate({
const sceneForActivity = scenes[self.length - 1];
const outputValue =
index === self.length - 1
? STATE_ON_TOP // the screen is on top after the transition
: index >= self.length - activeScreensLimit
? STATE_TRANSITIONING_OR_BELOW_TOP // the screen should stay active after the transition, it is not on top but is in activeLimit
: STATE_INACTIVE; // the screen should be active only during the transition, it is at the edge of activeLimit
isScreenActive = sceneForActivity
? sceneForActivity.progress.current.interpolate({
inputRange: [0, 1 - EPSILON, 1],
outputRange: [1, 1, 0],
outputRange: [1, 1, outputValue],
extrapolate: 'clamp',
})
: 1;
: STATE_TRANSITIONING_OR_BELOW_TOP;
}
const {