mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-02-09 09:13:32 +08:00
fix: rework focus and blur events to make them more reliable
closes #4867, #6187, #6451, #7628, #7749
This commit is contained in:
Satyajit Sahoo
@@ -1,6 +1,6 @@
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/index.tsx src/vendor/index.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/index.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/index.tsx 2020-03-23 00:04:37.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/index.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/index.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -3,11 +3,6 @@
|
||||
import * as TransitionSpecs from './TransitionConfigs/TransitionSpecs';
|
||||
import * as TransitionPresets from './TransitionConfigs/TransitionPresets';
|
||||
@@ -28,7 +28,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/index.tsx src/vendor/i
|
||||
StackHeaderTitleProps,
|
||||
StackCardInterpolatedStyle,
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx src/vendor/navigators/createStackNavigator.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/navigators/createStackNavigator.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/navigators/createStackNavigator.tsx 1970-01-01 01:00:00.000000000 +0100
|
||||
@@ -1,81 +0,0 @@
|
||||
-import * as React from 'react';
|
||||
@@ -113,8 +113,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/navigators/createStack
|
||||
- typeof StackNavigator
|
||||
->(StackNavigator);
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/types.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/types.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/types.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/types.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/types.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -8,14 +8,28 @@
|
||||
} from 'react-native';
|
||||
import { EdgeInsets } from 'react-native-safe-area-context';
|
||||
@@ -240,8 +240,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/types.tsx src/vendor/t
|
||||
|
||||
export type StackNavigationConfig = {
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx src/vendor/views/Header/Header.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/Header.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/Header.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/Header.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -1,12 +1,14 @@
|
||||
import * as React from 'react';
|
||||
-import { StackActions } from '@react-navigation/native';
|
||||
@@ -321,8 +321,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/Header.ts
|
||||
+
|
||||
+export default Header;
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx src/vendor/views/Header/HeaderBackButton.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderBackButton.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackButton.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderBackButton.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -8,9 +8,9 @@
|
||||
StyleSheet,
|
||||
LayoutChangeEvent,
|
||||
@@ -335,8 +335,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBac
|
||||
|
||||
type Props = StackHeaderLeftButtonProps;
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx src/vendor/views/Header/HeaderBackground.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderBackground.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBackground.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderBackground.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import { Animated, StyleSheet, Platform, ViewProps } from 'react-native';
|
||||
@@ -346,8 +346,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderBac
|
||||
type Props = ViewProps & {
|
||||
children?: React.ReactNode;
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx src/vendor/views/Header/HeaderContainer.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderContainer.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderContainer.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderContainer.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -1,11 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import { View, StyleSheet, StyleProp, ViewStyle } from 'react-native';
|
||||
@@ -399,8 +399,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderCon
|
||||
);
|
||||
})}
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx src/vendor/views/Header/HeaderSegment.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderSegment.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSegment.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderSegment.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -8,7 +8,7 @@
|
||||
ViewStyle,
|
||||
} from 'react-native';
|
||||
@@ -420,8 +420,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderSeg
|
||||
};
|
||||
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx src/vendor/views/Header/HeaderTitle.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderTitle.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTitle.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Header/HeaderTitle.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import { Animated, StyleSheet, Platform } from 'react-native';
|
||||
@@ -431,8 +431,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Header/HeaderTit
|
||||
type Props = React.ComponentProps<typeof Animated.Text> & {
|
||||
tintColor?: string;
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx src/vendor/views/Stack/Card.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/Card.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/Card.tsx 2020-03-23 11:43:59.000000000 +0100
|
||||
@@ -138,7 +138,7 @@
|
||||
|
||||
private interactionHandle: number | undefined;
|
||||
@@ -443,8 +443,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/Card.tsx s
|
||||
private animate = ({
|
||||
closing,
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx src/vendor/views/Stack/CardContainer.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/CardContainer.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardContainer.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/CardContainer.tsx 2020-03-27 14:41:20.000000000 +0100
|
||||
@@ -1,10 +1,16 @@
|
||||
import * as React from 'react';
|
||||
import { Animated, View, StyleSheet, StyleProp, ViewStyle } from 'react-native';
|
||||
@@ -464,33 +464,7 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContai
|
||||
|
||||
type Props = TransitionPreset & {
|
||||
index: number;
|
||||
@@ -36,6 +42,7 @@
|
||||
closing: boolean
|
||||
) => void;
|
||||
onTransitionEnd?: (props: { route: Route<string> }, closing: boolean) => void;
|
||||
+ onTransitionComplete: (props: { route: Route<string> }) => void;
|
||||
onPageChangeStart?: () => void;
|
||||
onPageChangeConfirm?: () => void;
|
||||
onPageChangeCancel?: () => void;
|
||||
@@ -83,6 +90,7 @@
|
||||
layout,
|
||||
onCloseRoute,
|
||||
onOpenRoute,
|
||||
+ onTransitionComplete,
|
||||
onPageChangeCancel,
|
||||
onPageChangeConfirm,
|
||||
onPageChangeStart,
|
||||
@@ -152,6 +160,9 @@
|
||||
};
|
||||
}, [pointerEvents, scene.progress.next]);
|
||||
|
||||
+ // eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
+ React.useEffect(() => onTransitionComplete({ route: scene.route }), []);
|
||||
+
|
||||
return (
|
||||
<Card
|
||||
index={index}
|
||||
@@ -183,7 +194,7 @@
|
||||
@@ -183,7 +189,7 @@
|
||||
? { marginTop: headerHeight }
|
||||
: null
|
||||
}
|
||||
@@ -500,8 +474,8 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardContai
|
||||
>
|
||||
<View style={styles.container}>
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx src/vendor/views/Stack/CardStack.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/CardStack.tsx 2020-03-23 00:04:40.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/CardStack.tsx 2020-03-27 14:41:20.000000000 +0100
|
||||
@@ -9,9 +9,8 @@
|
||||
ViewProps,
|
||||
} from 'react-native';
|
||||
@@ -521,33 +495,9 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/CardStack.
|
||||
Layout,
|
||||
StackHeaderMode,
|
||||
StackCardMode,
|
||||
@@ -54,6 +54,7 @@
|
||||
renderHeader: (props: HeaderContainerProps) => React.ReactNode;
|
||||
renderScene: (props: { route: Route<string> }) => React.ReactNode;
|
||||
headerMode: StackHeaderMode;
|
||||
+ onTransitionComplete: (props: { route: Route<string> }) => void;
|
||||
onTransitionStart: (
|
||||
props: { route: Route<string> },
|
||||
closing: boolean
|
||||
@@ -383,6 +384,7 @@
|
||||
renderHeader,
|
||||
renderScene,
|
||||
headerMode,
|
||||
+ onTransitionComplete,
|
||||
onTransitionStart,
|
||||
onTransitionEnd,
|
||||
onPageChangeStart,
|
||||
@@ -560,6 +562,7 @@
|
||||
renderScene={renderScene}
|
||||
onOpenRoute={onOpenRoute}
|
||||
onCloseRoute={onCloseRoute}
|
||||
+ onTransitionComplete={onTransitionComplete}
|
||||
onTransitionStart={onTransitionStart}
|
||||
onTransitionEnd={onTransitionEnd}
|
||||
gestureEnabled={index !== 0 && getGesturesEnabled({ route })}
|
||||
diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx src/vendor/views/Stack/StackView.tsx
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx 2020-03-23 00:04:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/StackView.tsx 2020-03-23 00:07:11.000000000 +0100
|
||||
--- ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.tsx 2020-03-23 11:43:17.000000000 +0100
|
||||
+++ src/vendor/views/Stack/StackView.tsx 2020-03-27 14:41:20.000000000 +0100
|
||||
@@ -4,9 +4,9 @@
|
||||
import { GestureHandlerRootView } from 'react-native-gesture-handler';
|
||||
import {
|
||||
@@ -676,11 +626,3 @@ diff -Naur ../../node_modules/@react-navigation/stack/src/views/Stack/StackView.
|
||||
|
||||
render() {
|
||||
const {
|
||||
@@ -395,6 +427,7 @@
|
||||
closingRouteKeys={closingRouteKeys}
|
||||
onOpenRoute={this.handleOpenRoute}
|
||||
onCloseRoute={this.handleCloseRoute}
|
||||
+ onTransitionComplete={this.handleTransitionComplete}
|
||||
onTransitionStart={this.handleTransitionStart}
|
||||
onTransitionEnd={this.handleTransitionEnd}
|
||||
renderHeader={this.renderHeader}
|
||||
|
||||
Reference in New Issue
Block a user