mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-01-21 11:28:14 +08:00
Compare commits
5 Commits
@react-nav
...
@react-nav
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
aa77f0618b | ||
|
|
a5520d7ef1 | ||
|
|
0c1a061a04 | ||
|
|
d5f5521d5d | ||
|
|
c90bff08d5 |
@@ -15,9 +15,11 @@ import {
|
||||
useCardAnimation,
|
||||
} from '@react-navigation/stack';
|
||||
import Article from '../Shared/Article';
|
||||
import NewsFeed from '../Shared/NewsFeed';
|
||||
|
||||
type TransparentStackParams = {
|
||||
Article: { author: string };
|
||||
NewsFeed: undefined;
|
||||
Dialog: undefined;
|
||||
};
|
||||
|
||||
@@ -37,6 +39,13 @@ const ArticleScreen = ({
|
||||
>
|
||||
Show Dialog
|
||||
</Button>
|
||||
<Button
|
||||
mode="contained"
|
||||
onPress={() => navigation.push('NewsFeed')}
|
||||
style={styles.button}
|
||||
>
|
||||
Push NewsFeed
|
||||
</Button>
|
||||
<Button
|
||||
mode="outlined"
|
||||
onPress={() => navigation.goBack()}
|
||||
@@ -53,6 +62,32 @@ const ArticleScreen = ({
|
||||
);
|
||||
};
|
||||
|
||||
const NewsFeedScreen = ({
|
||||
navigation,
|
||||
}: StackScreenProps<TransparentStackParams, 'NewsFeed'>) => {
|
||||
return (
|
||||
<ScrollView>
|
||||
<View style={styles.buttons}>
|
||||
<Button
|
||||
mode="contained"
|
||||
onPress={() => navigation.push('Dialog')}
|
||||
style={styles.button}
|
||||
>
|
||||
Show Dialog
|
||||
</Button>
|
||||
<Button
|
||||
mode="outlined"
|
||||
onPress={() => navigation.goBack()}
|
||||
style={styles.button}
|
||||
>
|
||||
Go back
|
||||
</Button>
|
||||
</View>
|
||||
<NewsFeed scrollEnabled={scrollEnabled} />
|
||||
</ScrollView>
|
||||
);
|
||||
};
|
||||
|
||||
const DialogScreen = ({
|
||||
navigation,
|
||||
}: StackScreenProps<TransparentStackParams>) => {
|
||||
@@ -116,6 +151,11 @@ export default function TransparentStackScreen({ navigation }: Props) {
|
||||
component={ArticleScreen}
|
||||
initialParams={{ author: 'Gandalf' }}
|
||||
/>
|
||||
<TransparentStack.Screen
|
||||
name="NewsFeed"
|
||||
component={NewsFeedScreen}
|
||||
options={{ presentation: 'modal' }}
|
||||
/>
|
||||
<TransparentStack.Screen
|
||||
name="Dialog"
|
||||
component={DialogScreen}
|
||||
@@ -131,6 +171,7 @@ export default function TransparentStackScreen({ navigation }: Props) {
|
||||
const styles = StyleSheet.create({
|
||||
buttons: {
|
||||
flexDirection: 'row',
|
||||
flexWrap: 'wrap',
|
||||
padding: 8,
|
||||
},
|
||||
button: {
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [6.0.0-next.13](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@6.0.0-next.12...@react-navigation/bottom-tabs@6.0.0-next.13) (2021-05-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/bottom-tabs
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.12](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@6.0.0-next.11...@react-navigation/bottom-tabs@6.0.0-next.12) (2021-05-23)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/bottom-tabs
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/bottom-tabs",
|
||||
"description": "Bottom tab navigator following iOS design guidelines",
|
||||
"version": "6.0.0-next.12",
|
||||
"version": "6.0.0-next.13",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -36,7 +36,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/elements": "^1.0.0-next.11",
|
||||
"@react-navigation/elements": "^1.0.0-next.12",
|
||||
"color": "^3.1.3",
|
||||
"warn-once": "^0.1.0"
|
||||
},
|
||||
|
||||
@@ -3,6 +3,17 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [6.0.0-next.10](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@6.0.0-next.9...@react-navigation/devtools@6.0.0-next.10) (2021-05-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* make react-native-flipper optional in devtools ([a5520d7](https://github.com/react-navigation/react-navigation/commit/a5520d7ef1f0980aa869ba2bdf92194d3e3a6b96))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.9](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@6.0.0-next.8...@react-navigation/devtools@6.0.0-next.9) (2021-05-23)
|
||||
|
||||
|
||||
|
||||
@@ -3,31 +3,3 @@
|
||||
Developer tools for React Navigation.
|
||||
|
||||
Installation instructions and documentation can be found on the [React Navigation website](https://reactnavigation.org/docs/6.x/devtools).
|
||||
|
||||
## Installation
|
||||
|
||||
Open a Terminal in your project's folder and run,
|
||||
|
||||
```sh
|
||||
yarn add @react-navigation/devtools
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
For redux dev tools extension integration, you can pass a ref to the container:
|
||||
|
||||
```js
|
||||
import * as React from 'react';
|
||||
import { NavigationContainer } from '@react-navigation/native';
|
||||
import { useReduxDevToolsExtension } from '@react-navigation/devtools';
|
||||
|
||||
export default function App() {
|
||||
const navigationRef = React.useRef();
|
||||
|
||||
useReduxDevToolsExtension(navigationRef);
|
||||
|
||||
return (
|
||||
<NavigationContainer ref={navigationRef}>{/* ... */}</NavigationContainer>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/devtools",
|
||||
"description": "Developer tools for React Navigation",
|
||||
"version": "6.0.0-next.9",
|
||||
"version": "6.0.0-next.10",
|
||||
"keywords": [
|
||||
"react",
|
||||
"react-native",
|
||||
@@ -51,8 +51,7 @@
|
||||
"typescript": "^4.2.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "*",
|
||||
"react-native-flipper": "*"
|
||||
"react": "*"
|
||||
},
|
||||
"react-native-builder-bob": {
|
||||
"source": "src",
|
||||
|
||||
@@ -1,12 +1,28 @@
|
||||
import * as React from 'react';
|
||||
import { addPlugin, Flipper } from 'react-native-flipper';
|
||||
import type { NavigationContainerRef } from '@react-navigation/core';
|
||||
import type { Flipper } from 'react-native-flipper';
|
||||
import { nanoid } from 'nanoid/non-secure';
|
||||
import useDevToolsBase from './useDevToolsBase';
|
||||
|
||||
let FlipperModule: typeof import('react-native-flipper') | undefined;
|
||||
|
||||
try {
|
||||
FlipperModule = require('react-native-flipper');
|
||||
} catch (e) {
|
||||
// Do nothing
|
||||
}
|
||||
|
||||
export default function useFlipper(
|
||||
ref: React.RefObject<NavigationContainerRef<any>>
|
||||
) {
|
||||
if (FlipperModule == null) {
|
||||
throw new Error(
|
||||
"Please install the 'react-native-flipper' package in your project to use Flipper integration for React Navigation."
|
||||
);
|
||||
}
|
||||
|
||||
const { addPlugin } = FlipperModule;
|
||||
|
||||
const connectionRef = React.useRef<Flipper.FlipperConnection>();
|
||||
|
||||
const { resetRoot } = useDevToolsBase(ref, (...args) => {
|
||||
@@ -91,5 +107,5 @@ export default function useFlipper(
|
||||
return false;
|
||||
},
|
||||
});
|
||||
}, [ref, resetRoot]);
|
||||
}, [addPlugin, ref, resetRoot]);
|
||||
}
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [6.0.0-next.12](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@6.0.0-next.11...@react-navigation/drawer@6.0.0-next.12) (2021-05-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/drawer
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.11](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@6.0.0-next.10...@react-navigation/drawer@6.0.0-next.11) (2021-05-23)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/drawer
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/drawer",
|
||||
"description": "Drawer navigator component with animated transitions and gesturess",
|
||||
"version": "6.0.0-next.11",
|
||||
"version": "6.0.0-next.12",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -41,7 +41,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/elements": "^1.0.0-next.11",
|
||||
"@react-navigation/elements": "^1.0.0-next.12",
|
||||
"color": "^3.1.3",
|
||||
"warn-once": "^0.1.0"
|
||||
},
|
||||
|
||||
@@ -523,7 +523,7 @@ export default class DrawerView extends React.Component<DrawerProps> {
|
||||
: multiply(this.drawerWidth, -1);
|
||||
|
||||
// FIXME: Currently hitSlop is broken when on Android when drawer is on right
|
||||
// https://github.com/kmagiera/react-native-gesture-handler/issues/569
|
||||
// https://github.com/software-mansion/react-native-gesture-handler/issues/569
|
||||
const hitSlop = isRight
|
||||
? // Extend hitSlop to the side of the screen when drawer is closed
|
||||
// This lets the user drag the drawer from the side of the screen
|
||||
|
||||
@@ -133,7 +133,7 @@ export default function Drawer({
|
||||
};
|
||||
|
||||
// FIXME: Currently hitSlop is broken when on Android when drawer is on right
|
||||
// https://github.com/kmagiera/react-native-gesture-handler/issues/569
|
||||
// https://github.com/software-mansion/react-native-gesture-handler/issues/569
|
||||
const hitSlop = isRight
|
||||
? // Extend hitSlop to the side of the screen when drawer is closed
|
||||
// This lets the user drag the drawer from the side of the screen
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [1.0.0-next.12](https://github.com/react-navigation/react-navigation/compare/@react-navigation/elements@1.0.0-next.11...@react-navigation/elements@1.0.0-next.12) (2021-05-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/elements
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [1.0.0-next.11](https://github.com/react-navigation/react-navigation/compare/@react-navigation/elements@1.0.0-next.10...@react-navigation/elements@1.0.0-next.11) (2021-05-23)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/elements
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/elements",
|
||||
"description": "UI Components for React Navigation",
|
||||
"version": "1.0.0-next.11",
|
||||
"version": "1.0.0-next.12",
|
||||
"keywords": [
|
||||
"react-native",
|
||||
"react-navigation",
|
||||
|
||||
@@ -11,7 +11,7 @@ export type Layout = { width: number; height: number };
|
||||
export type HeaderOptions = {
|
||||
/**
|
||||
* String or a function that returns a React Element to be used by the header.
|
||||
* Defaults to scene `title`.
|
||||
* Defaults to screen `title` or route name.
|
||||
*
|
||||
* It receives `allowFontScaling`, `tintColor`, `style` and `children` in the options object as an argument.
|
||||
* The title string is passed in `children`.
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [6.0.0-next.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native-stack@6.0.0-next.1...@react-navigation/native-stack@6.0.0-next.2) (2021-05-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/native-stack
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native-stack@5.0.5...@react-navigation/native-stack@6.0.0-next.1) (2021-05-23)
|
||||
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
# `@react-navigation/native-stack`
|
||||
|
||||
Stack navigator for React Native using native primitives for navigation. Uses [`react-native-screens`](https://github.com/kmagiera/react-native-screens) under the hood.
|
||||
Stack navigator for React Native using native primitives for navigation. Uses [`react-native-screens`](https://github.com/software-mansion/react-native-screens) under the hood.
|
||||
|
||||
Installation instructions and documentation can be found on the [React Navigation website](https://reactnavigation.org/docs/native-stack-navigator.html).
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/native-stack",
|
||||
"description": "Native stack navigator using react-native-screens",
|
||||
"version": "6.0.0-next.1",
|
||||
"version": "6.0.0-next.2",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -41,7 +41,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/elements": "^1.0.0-next.11",
|
||||
"@react-navigation/elements": "^1.0.0-next.12",
|
||||
"warn-once": "^0.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -94,10 +94,10 @@ export type NativeStackNavigationOptions = {
|
||||
*
|
||||
* @platform ios
|
||||
*/
|
||||
headerBackTitleStyle?: {
|
||||
headerBackTitleStyle?: StyleProp<{
|
||||
fontFamily?: string;
|
||||
fontSize?: number;
|
||||
};
|
||||
}>;
|
||||
/**
|
||||
* Image to display in the header as the icon in the back button.
|
||||
* Defaults to back icon image for the platform
|
||||
@@ -197,10 +197,12 @@ export type NativeStackNavigationOptions = {
|
||||
headerRight?: (props: { tintColor?: string }) => React.ReactNode;
|
||||
/**
|
||||
* String or a function that returns a React Element to be used by the header.
|
||||
* Defaults to scene `title`.
|
||||
* Defaults to screen `title` or route name.
|
||||
*
|
||||
* It receives `tintColor` and`children` in the options object as an argument.
|
||||
* When a function is passed, it receives `tintColor` and`children` in the options object as an argument.
|
||||
* The title string is passed in `children`.
|
||||
*
|
||||
* Note that if you render a custom element by passing a function, animations for the title won't work.
|
||||
*/
|
||||
headerTitle?:
|
||||
| string
|
||||
@@ -227,16 +229,6 @@ export type NativeStackNavigationOptions = {
|
||||
fontWeight?: string;
|
||||
color?: string;
|
||||
}>;
|
||||
/**
|
||||
* Whether there should be additional top inset to account for translucent status bar.
|
||||
* If you don't have a translucent status bar, you can disable this by passing `false`
|
||||
*
|
||||
* Only supported on Android. Insets are always applied on iOS because the
|
||||
* header cannot be opaque.
|
||||
*
|
||||
* @platform android
|
||||
*/
|
||||
headerTopInsetEnabled?: boolean;
|
||||
/**
|
||||
* Options to render a native search bar on iOS.
|
||||
*
|
||||
@@ -245,7 +237,7 @@ export type NativeStackNavigationOptions = {
|
||||
headerSearchBar?: SearchBarProps;
|
||||
/**
|
||||
* Sets the status bar animation (similar to the `StatusBar` component).
|
||||
* Requires setting `View controller-based status bar appearance -> YES` in your Info.plist file.
|
||||
* Requires setting `View controller-based status bar appearance -> YES` (or removing the config) in your `Info.plist` file.
|
||||
*
|
||||
* Only supported on iOS.
|
||||
*
|
||||
@@ -263,7 +255,7 @@ export type NativeStackNavigationOptions = {
|
||||
statusBarHidden?: boolean;
|
||||
/**
|
||||
* Sets the status bar color (similar to the `StatusBar` component).
|
||||
* Requires setting `View controller-based status bar appearance -> YES` in your Info.plist file.
|
||||
* Requires setting `View controller-based status bar appearance -> YES` (or removing the config) in your `Info.plist` file.
|
||||
*
|
||||
* Only supported on iOS.
|
||||
*
|
||||
|
||||
@@ -11,6 +11,7 @@ import {
|
||||
} from 'react-native-screens';
|
||||
import { Route, useTheme } from '@react-navigation/native';
|
||||
import { HeaderTitle } from '@react-navigation/elements';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import type { NativeStackNavigationOptions } from '../types';
|
||||
import { processFonts } from './FontProcessor';
|
||||
|
||||
@@ -37,7 +38,6 @@ export default function HeaderConfig({
|
||||
headerTintColor,
|
||||
headerTitle,
|
||||
headerTitleStyle,
|
||||
headerTopInsetEnabled = true,
|
||||
headerTranslucent,
|
||||
route,
|
||||
orientation,
|
||||
@@ -47,6 +47,7 @@ export default function HeaderConfig({
|
||||
statusBarStyle,
|
||||
title,
|
||||
}: Props): JSX.Element {
|
||||
const insets = useSafeAreaInsets();
|
||||
const { colors } = useTheme();
|
||||
const tintColor =
|
||||
headerTintColor != null
|
||||
@@ -131,7 +132,7 @@ export default function HeaderConfig({
|
||||
titleFontFamily={titleFontFamily}
|
||||
titleFontSize={headerTitleStyleFlattened.fontSize}
|
||||
titleFontWeight={headerTitleStyleFlattened.fontWeight}
|
||||
topInsetEnabled={headerTopInsetEnabled}
|
||||
topInsetEnabled={insets.top !== 0}
|
||||
translucent={
|
||||
// This defaults to `true`, so we can't pass `undefined`
|
||||
headerTranslucent === true
|
||||
|
||||
@@ -15,7 +15,6 @@ import {
|
||||
ScreenStack,
|
||||
StackPresentationTypes,
|
||||
} from 'react-native-screens';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import warnOnce from 'warn-once';
|
||||
import HeaderConfig from './HeaderConfig';
|
||||
import type {
|
||||
@@ -117,8 +116,6 @@ type Props = {
|
||||
};
|
||||
|
||||
function NativeStackViewInner({ state, navigation, descriptors }: Props) {
|
||||
const insets = useSafeAreaInsets();
|
||||
|
||||
return (
|
||||
<ScreenStack style={styles.container}>
|
||||
{state.routes.map((route, index) => {
|
||||
@@ -197,9 +194,6 @@ function NativeStackViewInner({ state, navigation, descriptors }: Props) {
|
||||
{...options}
|
||||
route={route}
|
||||
headerShown={isHeaderInPush}
|
||||
headerTopInsetEnabled={
|
||||
options.headerTopInsetEnabled ?? insets.top !== 0
|
||||
}
|
||||
/>
|
||||
<MaybeNestedStack
|
||||
options={options}
|
||||
|
||||
@@ -3,6 +3,25 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
# [6.0.0-next.20](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@6.0.0-next.19...@react-navigation/stack@6.0.0-next.20) (2021-05-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/stack
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.19](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@6.0.0-next.18...@react-navigation/stack@6.0.0-next.19) (2021-05-24)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* make transparent modal work with modal presentation ([c90bff0](https://github.com/react-navigation/react-navigation/commit/c90bff08d54d1c7151737a43d4f73abe7d364366))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [6.0.0-next.18](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@6.0.0-next.17...@react-navigation/stack@6.0.0-next.18) (2021-05-23)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/stack",
|
||||
"description": "Stack navigator component for iOS and Android with animated transitions and gestures",
|
||||
"version": "6.0.0-next.18",
|
||||
"version": "6.0.0-next.20",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -40,7 +40,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/elements": "^1.0.0-next.11",
|
||||
"@react-navigation/elements": "^1.0.0-next.12",
|
||||
"color": "^3.1.3",
|
||||
"react-native-iphone-x-helper": "^1.3.0",
|
||||
"warn-once": "^0.1.0"
|
||||
|
||||
@@ -129,7 +129,7 @@ export type StackHeaderOptions = HeaderOptions & {
|
||||
headerBackTestID?: string;
|
||||
/**
|
||||
* Title string used by the back button on iOS.
|
||||
* Defaults to the previous scene's title, or "Back" if there's not enough space.
|
||||
* Defaults to the previous screen's title, or "Back" if there's not enough space.
|
||||
* Use `headerBackTitleVisible: false` to hide it.
|
||||
*/
|
||||
headerBackTitle?: string;
|
||||
|
||||
@@ -225,7 +225,7 @@ function CardContainer({
|
||||
insets={insets}
|
||||
gesture={gesture}
|
||||
current={scene.progress.current}
|
||||
next={isNextScreenTransparent ? undefined : scene.progress.next}
|
||||
next={scene.progress.next}
|
||||
closing={closing}
|
||||
onOpen={handleOpen}
|
||||
onClose={handleClose}
|
||||
|
||||
@@ -219,7 +219,9 @@ export default class CardStack extends React.Component<Props, State> {
|
||||
// This will still be broken when 2 transitions have different idle state (e.g. modal presentation),
|
||||
// but majority of the transitions look alright
|
||||
const optionsForTransitionConfig =
|
||||
index !== self.length - 1 && nextDescriptor
|
||||
index !== self.length - 1 &&
|
||||
nextDescriptor &&
|
||||
nextDescriptor.options.presentation !== 'transparentModal'
|
||||
? nextDescriptor.options
|
||||
: descriptor.options;
|
||||
|
||||
@@ -251,6 +253,8 @@ export default class CardStack extends React.Component<Props, State> {
|
||||
(!(
|
||||
optionsForTransitionConfig.presentation === 'modal' ||
|
||||
optionsForTransitionConfig.presentation === 'transparentModal' ||
|
||||
nextDescriptor?.options.presentation === 'modal' ||
|
||||
nextDescriptor?.options.presentation === 'transparentModal' ||
|
||||
cardStyleInterpolator === forModalPresentationIOS
|
||||
) &&
|
||||
Platform.OS === 'ios' &&
|
||||
@@ -280,13 +284,15 @@ export default class CardStack extends React.Component<Props, State> {
|
||||
state.layout,
|
||||
descriptor
|
||||
),
|
||||
next: nextGesture
|
||||
? getProgressFromGesture(
|
||||
nextGesture,
|
||||
state.layout,
|
||||
nextDescriptor
|
||||
)
|
||||
: undefined,
|
||||
next:
|
||||
nextGesture &&
|
||||
nextDescriptor.options.presentation !== 'transparentModal'
|
||||
? getProgressFromGesture(
|
||||
nextGesture,
|
||||
state.layout,
|
||||
nextDescriptor
|
||||
)
|
||||
: undefined,
|
||||
previous: previousGesture
|
||||
? getProgressFromGesture(
|
||||
previousGesture,
|
||||
@@ -466,9 +472,13 @@ export default class CardStack extends React.Component<Props, State> {
|
||||
const { options } = scenes[i].descriptor;
|
||||
const {
|
||||
// By default, we don't want to detach the previous screen of the active one for modals
|
||||
detachPreviousScreen = options.presentation === 'transparentModal' ||
|
||||
options.cardStyleInterpolator === forModalPresentationIOS
|
||||
? i !== scenes.length - 1
|
||||
detachPreviousScreen = options.presentation === 'transparentModal'
|
||||
? false
|
||||
: options.cardStyleInterpolator === forModalPresentationIOS
|
||||
? i !==
|
||||
scenes
|
||||
.map((scene) => scene.descriptor.options.cardStyleInterpolator)
|
||||
.lastIndexOf(forModalPresentationIOS)
|
||||
: true,
|
||||
} = options;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user