@react-navigation/stack

  • Version 7.10.11
  • Published
  • 474 kB
  • 3 dependencies
  • MIT license

Install

npm i @react-navigation/stack
yarn add @react-navigation/stack
pnpm add @react-navigation/stack

Overview

Stack navigator component for iOS and Android with animated transitions and gestures

Index

Variables

variable CardAnimationContext

const CardAnimationContext: React.Context<StackCardInterpolationProps>;

    variable createStackScreen

    const createStackScreen: any;

      variable GestureHandlerRefContext

      const GestureHandlerRefContext: React.Context<React.Ref<React.ComponentType<any>>>;
        const Header: React.NamedExoticComponent<StackHeaderProps>;

          Functions

          function createStackNavigator

          createStackNavigator: () => any;

            function useCardAnimation

            useCardAnimation: () => import('../index.js').StackCardInterpolationProps;

              function useGestureHandlerRef

              useGestureHandlerRef: () => React.Ref<React.ComponentType<any>>;

                Classes

                class StackView

                class StackView extends React.Component<Props, State> {}

                  property state

                  state: State;

                    method getDerivedStateFromProps

                    static getDerivedStateFromProps: (
                    props: Readonly<Props>,
                    state: Readonly<State>
                    ) =>
                    | {
                    routes: Route<string>[];
                    previousState: StackNavigationState<ParamListBase>;
                    descriptors: StackDescriptorMap;
                    openingRouteKeys?: undefined;
                    closingRouteKeys?: undefined;
                    replacingRouteKeys?: undefined;
                    }
                    | {
                    routes: import('@react-navigation/routers').NavigationRoute<
                    ParamListBase,
                    string
                    >[];
                    previousState: StackNavigationState<ParamListBase>;
                    openingRouteKeys: string[];
                    closingRouteKeys: string[];
                    replacingRouteKeys: string[];
                    descriptors: StackDescriptorMap;
                    };

                      method render

                      render: () => any;

                        Type Aliases

                        type StackAnimationName

                        type StackAnimationName =
                        | 'default'
                        | 'fade'
                        | 'fade_from_bottom'
                        | 'fade_from_right'
                        | 'none'
                        | 'reveal_from_bottom'
                        | 'scale_from_center'
                        | 'slide_from_bottom'
                        | 'slide_from_right'
                        | 'slide_from_left';

                          type StackCardInterpolatedStyle

                          type StackCardInterpolatedStyle = {
                          /**
                          * Interpolated style for the container view wrapping the card.
                          */
                          containerStyle?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
                          /**
                          * Interpolated style for the view representing the card.
                          */
                          cardStyle?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
                          /**
                          * Interpolated style for the view representing the semi-transparent overlay below the card.
                          */
                          overlayStyle?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
                          /**
                          * Interpolated style representing the card shadow.
                          */
                          shadowStyle?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
                          };

                            type StackCardInterpolationProps

                            type StackCardInterpolationProps = {
                            /**
                            * Values for the current screen.
                            */
                            current: {
                            /**
                            * Animated node representing the progress value of the current screen.
                            */
                            progress: Animated.AnimatedInterpolation<number>;
                            };
                            /**
                            * Values for the screen after this one in the stack.
                            * This can be `undefined` in case the screen animating is the last one.
                            */
                            next?: {
                            /**
                            * Animated node representing the progress value of the next screen.
                            */
                            progress: Animated.AnimatedInterpolation<number>;
                            };
                            /**
                            * The index of the card with this interpolation in the stack.
                            */
                            index: number;
                            /**
                            * Animated node representing whether the card is closing (1 - closing, 0 - not closing).
                            */
                            closing: Animated.AnimatedInterpolation<0 | 1>;
                            /**
                            * Animated node representing whether the card is being swiped (1 - swiping, 0 - not swiping).
                            */
                            swiping: Animated.AnimatedInterpolation<0 | 1>;
                            /**
                            * Animated node representing multiplier when direction is inverted (-1 - inverted, 1 - normal).
                            */
                            inverted: Animated.AnimatedInterpolation<1 | -1>;
                            /**
                            * Layout measurements for various items we use for animation.
                            */
                            layouts: {
                            /**
                            * Layout of the whole screen.
                            */
                            screen: Layout;
                            };
                            /**
                            * Safe area insets
                            */
                            insets: {
                            top: number;
                            right: number;
                            bottom: number;
                            left: number;
                            };
                            };

                              type StackCardStyleInterpolator

                              type StackCardStyleInterpolator = (
                              props: StackCardInterpolationProps
                              ) => StackCardInterpolatedStyle;

                                type StackHeaderInterpolatedStyle

                                type StackHeaderInterpolatedStyle = {
                                /**
                                * Interpolated style for the label of the left button (back button label).
                                */
                                leftLabelStyle?: any;
                                /**
                                * Interpolated style for the left button (usually the back button).
                                */
                                leftButtonStyle?: any;
                                /**
                                * Interpolated style for the right button.
                                */
                                rightButtonStyle?: any;
                                /**
                                * Interpolated style for the header title text.
                                */
                                titleStyle?: any;
                                /**
                                * Interpolated style for the header background.
                                */
                                backgroundStyle?: any;
                                };

                                  type StackHeaderInterpolationProps

                                  type StackHeaderInterpolationProps = {
                                  /**
                                  * Values for the current screen (the screen which owns this header).
                                  */
                                  current: {
                                  /**
                                  * Animated node representing the progress value of the current screen.
                                  */
                                  progress: Animated.AnimatedInterpolation<number>;
                                  };
                                  /**
                                  * Values for the screen after this one in the stack.
                                  * This can be `undefined` in case the screen animating is the last one.
                                  */
                                  next?: {
                                  /**
                                  * Animated node representing the progress value of the next screen.
                                  */
                                  progress: Animated.AnimatedInterpolation<number>;
                                  };
                                  /**
                                  * Writing direction of the layout.
                                  */
                                  direction: LocaleDirection;
                                  /**
                                  * Layout measurements for various items we use for animation.
                                  */
                                  layouts: {
                                  /**
                                  * Layout of the header
                                  */
                                  header: Layout;
                                  /**
                                  * Layout of the whole screen.
                                  */
                                  screen: Layout;
                                  /**
                                  * Layout of the title element.
                                  */
                                  title?: Layout;
                                  /**
                                  * Layout of the back button label.
                                  */
                                  leftLabel?: Layout;
                                  };
                                  };

                                    type StackHeaderLeftProps

                                    type StackHeaderLeftProps = HeaderBackButtonProps & {
                                    /**
                                    * Whether it's possible to navigate back in stack.
                                    */
                                    canGoBack?: boolean;
                                    };

                                      type StackHeaderProps

                                      type StackHeaderProps = {
                                      /**
                                      * Layout of the screen.
                                      */
                                      layout: Layout;
                                      /**
                                      * Options for the back button.
                                      */
                                      back?: {
                                      /**
                                      * Title of the previous screen.
                                      */
                                      title: string | undefined;
                                      /**
                                      * The `href` to use for the anchor tag on web
                                      */
                                      href: string | undefined;
                                      };
                                      /**
                                      * Animated nodes representing the progress of the animation.
                                      */
                                      progress: SceneProgress;
                                      /**
                                      * Options for the current screen.
                                      */
                                      options: StackNavigationOptions;
                                      /**
                                      * Route object for the current screen.
                                      */
                                      route: Route<string>;
                                      /**
                                      * Navigation prop for the header.
                                      */
                                      navigation: StackNavigationProp<ParamListBase>;
                                      /**
                                      * Interpolated styles for various elements in the header.
                                      */
                                      styleInterpolator: StackHeaderStyleInterpolator;
                                      };

                                        type StackHeaderRightProps

                                        type StackHeaderRightProps = {
                                        /**
                                        * Tint color for the header button.
                                        */
                                        tintColor?: string;
                                        /**
                                        * Color for material ripple (Android >= 5.0 only).
                                        */
                                        pressColor?: string;
                                        /**
                                        * Opacity when the button is pressed, used when ripple is not supported.
                                        */
                                        pressOpacity?: number;
                                        /**
                                        * Whether it's possible to navigate back in stack.
                                        */
                                        canGoBack?: boolean;
                                        };

                                          type StackHeaderStyleInterpolator

                                          type StackHeaderStyleInterpolator = (
                                          props: StackHeaderInterpolationProps
                                          ) => StackHeaderInterpolatedStyle;

                                            type StackNavigationEventMap

                                            type StackNavigationEventMap = {
                                            /**
                                            * Event which fires when a transition animation starts.
                                            */
                                            transitionStart: {
                                            data: {
                                            closing: boolean;
                                            };
                                            };
                                            /**
                                            * Event which fires when a transition animation ends.
                                            */
                                            transitionEnd: {
                                            data: {
                                            closing: boolean;
                                            };
                                            };
                                            /**
                                            * Event which fires when navigation gesture starts.
                                            */
                                            gestureStart: {
                                            data: undefined;
                                            };
                                            /**
                                            * Event which fires when navigation gesture is completed.
                                            */
                                            gestureEnd: {
                                            data: undefined;
                                            };
                                            /**
                                            * Event which fires when navigation gesture is canceled.
                                            */
                                            gestureCancel: {
                                            data: undefined;
                                            };
                                            };

                                              type StackNavigationOptions

                                              type StackNavigationOptions = StackHeaderOptions &
                                              Partial<TransitionPreset> & {
                                              /**
                                              * String that can be displayed in the header as a fallback for `headerTitle`.
                                              */
                                              title?: string;
                                              /**
                                              * Function that given `HeaderProps` returns a React Element to display as a header.
                                              */
                                              header?: (props: StackHeaderProps) => React.ReactNode;
                                              /**
                                              * Whether the header floats above the screen or part of the screen.
                                              * Defaults to `float` on iOS for non-modals, and `screen` for the rest.
                                              */
                                              headerMode?: StackHeaderMode;
                                              /**
                                              * Whether to show the header. The header is shown by default.
                                              * Setting this to `false` hides the header.
                                              */
                                              headerShown?: boolean;
                                              /**
                                              * Whether a shadow is visible for the card during transitions. Defaults to `true`.
                                              */
                                              cardShadowEnabled?: boolean;
                                              /**
                                              * Whether to have a semi-transparent dark overlay visible under the card during transitions.
                                              * Defaults to `true` on Android and `false` on iOS.
                                              */
                                              cardOverlayEnabled?: boolean;
                                              /**
                                              * Function that returns a React Element to display as a overlay for the card.
                                              */
                                              cardOverlay?: (props: {
                                              style: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
                                              }) => React.ReactNode;
                                              /**
                                              * Style object for the card in stack.
                                              * You can provide a custom background color to use instead of the default background here.
                                              *
                                              * You can also specify `{ backgroundColor: 'transparent' }` to make the previous screen visible underneath.
                                              * This is useful to implement things like modal dialogs.
                                              *
                                              * You should also specify `detachPreviousScreen: false` in options when using a transparent background
                                              * so that the previous screen isn't detached and stays below the current screen.
                                              *
                                              * You might also need to change the animation of the screen using `cardStyleInterpolator`
                                              * so that the previous screen isn't transformed or invisible.
                                              */
                                              cardStyle?: StyleProp<ViewStyle>;
                                              /**
                                              * Whether this screen should be presented as a modal or a regular card.
                                              *
                                              * Specifying this will configure several options:
                                              * - `card`: Use the default OS animations for iOS and Android screen transitions.
                                              * - `modal`: Use Modal animations. This changes a few things:
                                              * - Sets `headerMode` to `screen` for the screen unless specified otherwise.
                                              * - Changes the screen animation to match the platform behavior for modals.
                                              * - `transparentModal`: Similar to `modal`. This changes following things:
                                              * - Sets `headerMode` to `screen` for the screen unless specified otherwise.
                                              * - Sets background color of the screen to transparent, so previous screen is visible
                                              * - Adjusts the `detachPreviousScreen` option so that the previous screen stays rendered.
                                              * - Prevents the previous screen from animating from its last position.
                                              * - Changes the screen animation to a vertical slide animation.
                                              *
                                              * Defaults to 'card'.
                                              */
                                              presentation?: 'card' | 'modal' | 'transparentModal';
                                              /**
                                              * How the screen should animate when pushed or popped.
                                              *
                                              * Supported values:
                                              * - 'none': don't animate the screen
                                              * - 'default': use the platform default animation
                                              * - 'fade': fade screen in or out
                                              * - 'fade_from_bottom': fade screen in or out from bottom
                                              * - 'slide_from_bottom': slide in the new screen from bottom
                                              * - 'slide_from_right': slide in the new screen from right
                                              * - 'slide_from_left': slide in the new screen from left
                                              * - 'reveal_from_bottom': reveal screen in from bottom to top
                                              * - 'scale_from_center': scale screen in from center
                                              */
                                              animation?: StackAnimationName;
                                              /**
                                              * The type of animation to use when this screen replaces another screen. Defaults to `push`.
                                              * When `pop` is used, the `pop` animation is applied to the screen being replaced.
                                              */
                                              animationTypeForReplace?: 'push' | 'pop';
                                              /**
                                              * Whether you can use gestures to dismiss this screen. Defaults to `true` on iOS, `false` on Android.
                                              * Not supported on Web.
                                              */
                                              gestureEnabled?: boolean;
                                              /**
                                              * Distance of touch start from the edge of the screen to recognize gestures.
                                              * Not supported on Web.
                                              */
                                              gestureResponseDistance?: number;
                                              /**
                                              * Number which determines the relevance of velocity for the gesture. Defaults to 0.3.
                                              * Not supported on Web.
                                              */
                                              gestureVelocityImpact?: number;
                                              /**
                                              * Whether to detach the previous screen from the view hierarchy to save memory.
                                              * Set it to `false` if you need the previous screen to be seen through the active screen.
                                              * Only applicable if `detachInactiveScreens` isn't set to `false`.
                                              * Defaults to `false` for the last screen for modals, otherwise `true`.
                                              */
                                              detachPreviousScreen?: boolean;
                                              /**
                                              * If `false`, the keyboard will NOT automatically dismiss when navigating to a new screen from this screen.
                                              * Defaults to `true`.
                                              */
                                              keyboardHandlingEnabled?: boolean;
                                              /**
                                              * Whether inactive screens should be suspended from re-rendering. Defaults to `false`.
                                              * Defaults to `true` when `enableFreeze()` is run at the top of the application.
                                              * Requires `react-native-screens` version >=3.16.0.
                                              *
                                              * Only supported on iOS and Android.
                                              */
                                              freezeOnBlur?: boolean;
                                              /**
                                              * Whether the home indicator should prefer to stay hidden on this screen. Defaults to `false`.
                                              *
                                              * @platform ios
                                              */
                                              autoHideHomeIndicator?: boolean;
                                              };

                                                type StackNavigationProp

                                                type StackNavigationProp<
                                                ParamList extends ParamListBase,
                                                RouteName extends keyof ParamList = keyof ParamList,
                                                NavigatorID extends string | undefined = undefined
                                                > = NavigationProp<
                                                ParamList,
                                                RouteName,
                                                NavigatorID,
                                                StackNavigationState<ParamList>,
                                                StackNavigationOptions,
                                                StackNavigationEventMap
                                                > &
                                                StackActionHelpers<ParamList>;

                                                  type StackNavigatorProps

                                                  type StackNavigatorProps = DefaultNavigatorOptions<
                                                  ParamListBase,
                                                  string | undefined,
                                                  StackNavigationState<ParamListBase>,
                                                  StackNavigationOptions,
                                                  StackNavigationEventMap,
                                                  StackNavigationProp<ParamListBase>
                                                  > &
                                                  StackRouterOptions &
                                                  StackNavigationConfig;

                                                    type StackOptionsArgs

                                                    type StackOptionsArgs<
                                                    ParamList extends ParamListBase,
                                                    RouteName extends keyof ParamList = keyof ParamList,
                                                    NavigatorID extends string | undefined = undefined
                                                    > = StackScreenProps<ParamList, RouteName, NavigatorID> & {
                                                    theme: Theme;
                                                    };

                                                      type StackScreenProps

                                                      type StackScreenProps<
                                                      ParamList extends ParamListBase,
                                                      RouteName extends keyof ParamList = keyof ParamList,
                                                      NavigatorID extends string | undefined = undefined
                                                      > = {
                                                      navigation: StackNavigationProp<ParamList, RouteName, NavigatorID>;
                                                      route: RouteProp<ParamList, RouteName>;
                                                      };

                                                        type StackTypeBag

                                                        type StackTypeBag<
                                                        ParamList extends ParamListBase = ParamListBase,
                                                        NavigatorID extends string | undefined = string | undefined
                                                        > = {
                                                        ParamList: ParamList;
                                                        NavigatorID: NavigatorID;
                                                        State: StackNavigationState<ParamList>;
                                                        ScreenOptions: StackNavigationOptions;
                                                        EventMap: StackNavigationEventMap;
                                                        NavigationList: {
                                                        [RouteName in keyof ParamList]: StackNavigationProp<
                                                        ParamList,
                                                        RouteName,
                                                        NavigatorID
                                                        >;
                                                        };
                                                        Navigator: typeof StackNavigator;
                                                        };

                                                          type TransitionPreset

                                                          type TransitionPreset = {
                                                          /**
                                                          * The direction of swipe gestures, `horizontal` or `vertical`.
                                                          */
                                                          gestureDirection: GestureDirection;
                                                          /**
                                                          * Object which specifies the animation type (timing or spring) and their options (such as duration for timing).
                                                          */
                                                          transitionSpec: {
                                                          /**
                                                          * Transition configuration when adding a screen.
                                                          */
                                                          open: TransitionSpec;
                                                          /**
                                                          * Transition configuration when removing a screen.
                                                          */
                                                          close: TransitionSpec;
                                                          };
                                                          /**
                                                          * Function which specifies interpolated styles for various parts of the card, e.g. the overlay, shadow etc.
                                                          */
                                                          cardStyleInterpolator: StackCardStyleInterpolator;
                                                          /**
                                                          * Function which specifies interpolated styles for various parts of the header, e.g. the title, left button etc.
                                                          */
                                                          headerStyleInterpolator: StackHeaderStyleInterpolator;
                                                          };

                                                            Namespaces

                                                            namespace CardStyleInterpolators

                                                            module 'lib/typescript/src/TransitionConfigs/CardStyleInterpolators.d.ts' {}
                                                            • Standard iOS-style slide in from the right.

                                                            function forBottomSheetAndroid

                                                            forBottomSheetAndroid: ({
                                                            current,
                                                            inverted,
                                                            layouts: { screen },
                                                            closing,
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Standard bottom sheet slide in from the bottom for Android.

                                                            function forFadeFromBottomAndroid

                                                            forFadeFromBottomAndroid: ({
                                                            current,
                                                            inverted,
                                                            layouts: { screen },
                                                            closing,
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Standard Android-style fade in from the bottom for Android Oreo.

                                                            function forFadeFromCenter

                                                            forFadeFromCenter: ({
                                                            current: { progress },
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Simple fade animation for dialogs

                                                            function forFadeFromRightAndroid

                                                            forFadeFromRightAndroid: ({
                                                            current,
                                                            next,
                                                            inverted,
                                                            closing,
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Standard Android-style fade from right for Android 14.

                                                            function forHorizontalIOS

                                                            forHorizontalIOS: ({
                                                            current,
                                                            next,
                                                            inverted,
                                                            layouts: { screen },
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Standard iOS-style slide in from the right.

                                                            function forHorizontalIOSInverted

                                                            forHorizontalIOSInverted: ({
                                                            inverted,
                                                            ...rest
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • iOS-style slide in from the left.

                                                            function forModalPresentationIOS

                                                            forModalPresentationIOS: ({
                                                            index,
                                                            current,
                                                            next,
                                                            inverted,
                                                            layouts: { screen },
                                                            insets,
                                                            }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                            • Standard iOS-style modal animation in iOS 13.

                                                            function forNoAnimation

                                                            forNoAnimation: () => StackCardInterpolatedStyle;

                                                              function forRevealFromBottomAndroid

                                                              forRevealFromBottomAndroid: ({
                                                              current,
                                                              next,
                                                              inverted,
                                                              layouts: { screen },
                                                              }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                              • Standard Android-style reveal from the bottom for Android Pie.

                                                              function forScaleFromCenterAndroid

                                                              forScaleFromCenterAndroid: ({
                                                              current,
                                                              next,
                                                              closing,
                                                              }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                              • Standard Android-style zoom for Android 10.

                                                              function forVerticalIOS

                                                              forVerticalIOS: ({
                                                              current,
                                                              inverted,
                                                              layouts: { screen },
                                                              }: StackCardInterpolationProps) => StackCardInterpolatedStyle;
                                                              • Standard iOS-style slide in from the bottom (used for modals).

                                                              namespace HeaderStyleInterpolators

                                                              module 'lib/typescript/src/TransitionConfigs/HeaderStyleInterpolators.d.ts' {}
                                                              • Standard UIKit style animation for the header where the title fades into the back button label.

                                                              function forFade

                                                              forFade: ({
                                                              current,
                                                              next,
                                                              }: StackHeaderInterpolationProps) => StackHeaderInterpolatedStyle;
                                                              • Simple fade animation for the header elements.

                                                              function forNoAnimation

                                                              forNoAnimation: () => StackHeaderInterpolatedStyle;

                                                                function forSlideLeft

                                                                forSlideLeft: ({
                                                                current,
                                                                next,
                                                                direction,
                                                                layouts: { screen },
                                                                }: StackHeaderInterpolationProps) => StackHeaderInterpolatedStyle;
                                                                • Simple translate animation to translate the header to left.

                                                                function forSlideRight

                                                                forSlideRight: ({
                                                                current,
                                                                next,
                                                                direction,
                                                                layouts: { screen },
                                                                }: StackHeaderInterpolationProps) => StackHeaderInterpolatedStyle;
                                                                • Simple translate animation to translate the header to right.

                                                                function forSlideUp

                                                                forSlideUp: ({
                                                                current,
                                                                next,
                                                                layouts: { header },
                                                                }: StackHeaderInterpolationProps) => StackHeaderInterpolatedStyle;
                                                                • Simple translate animation to translate the header to slide up.

                                                                function forUIKit

                                                                forUIKit: ({
                                                                current,
                                                                next,
                                                                direction,
                                                                layouts,
                                                                }: StackHeaderInterpolationProps) => StackHeaderInterpolatedStyle;
                                                                • Standard UIKit style animation for the header where the title fades into the back button label.

                                                                namespace TransitionPresets

                                                                module 'lib/typescript/src/TransitionConfigs/TransitionPresets.d.ts' {}
                                                                • Standard iOS navigation transition.

                                                                variable BottomSheetAndroid

                                                                const BottomSheetAndroid: TransitionPreset;
                                                                • Standard bottom sheet slide transition for Android 10.

                                                                variable DefaultTransition

                                                                const DefaultTransition: TransitionPreset;
                                                                • Default navigation transition for the current platform.

                                                                variable FadeFromBottomAndroid

                                                                const FadeFromBottomAndroid: TransitionPreset;
                                                                • Standard Android navigation transition when opening or closing an Activity on Android < 9 (Oreo).

                                                                variable FadeFromRightAndroid

                                                                const FadeFromRightAndroid: TransitionPreset;
                                                                • Standard Android navigation transition when opening or closing an Activity on Android 14.

                                                                variable ModalFadeTransition

                                                                const ModalFadeTransition: TransitionPreset;
                                                                • Fade transition for transparent modals.

                                                                variable ModalPresentationIOS

                                                                const ModalPresentationIOS: TransitionPreset;
                                                                • Standard iOS modal presentation style (introduced in iOS 13).

                                                                variable ModalSlideFromBottomIOS

                                                                const ModalSlideFromBottomIOS: TransitionPreset;
                                                                • Standard iOS navigation transition for modals.

                                                                variable ModalTransition

                                                                const ModalTransition: TransitionPreset;
                                                                • Default modal transition for the current platform.

                                                                variable RevealFromBottomAndroid

                                                                const RevealFromBottomAndroid: TransitionPreset;
                                                                • Standard Android navigation transition when opening or closing an Activity on Android 9 (Pie).

                                                                variable ScaleFromCenterAndroid

                                                                const ScaleFromCenterAndroid: TransitionPreset;
                                                                • Standard Android navigation transition when opening or closing an Activity on Android 10 (Q).

                                                                variable SlideFromLeftIOS

                                                                const SlideFromLeftIOS: TransitionPreset;
                                                                • Slide from left transition.

                                                                variable SlideFromRightIOS

                                                                const SlideFromRightIOS: TransitionPreset;
                                                                • Standard iOS navigation transition.

                                                                namespace TransitionSpecs

                                                                module 'lib/typescript/src/TransitionConfigs/TransitionSpecs.d.ts' {}
                                                                • Exact values from UINavigationController's animation configuration.

                                                                variable BottomSheetSlideInSpec

                                                                const BottomSheetSlideInSpec: TransitionSpec;
                                                                • Configuration for bottom sheet slide in animation from Material Design. See https://github.com/material-components/material-components-android/blob/fd3639092e1ffef9dc11bcedf79f32801d85e898/lib/java/com/google/android/material/bottomsheet/res/anim/mtrl_bottom_sheet_slide_in.xml

                                                                variable BottomSheetSlideOutSpec

                                                                const BottomSheetSlideOutSpec: TransitionSpec;
                                                                • Configuration for bottom sheet slide out animation from Material Design. See https://github.com/material-components/material-components-android/blob/fd3639092e1ffef9dc11bcedf79f32801d85e898/lib/java/com/google/android/material/bottomsheet/res/anim/mtrl_bottom_sheet_slide_in.xml

                                                                variable FadeInFromBottomAndroidSpec

                                                                const FadeInFromBottomAndroidSpec: TransitionSpec;
                                                                • Configuration for activity open animation from Android Nougat. See http://aosp.opersys.com/xref/android-7.1.2_r37/xref/frameworks/base/core/res/res/anim/activity_open_enter.xml

                                                                variable FadeInFromRightAndroidSpec

                                                                const FadeInFromRightAndroidSpec: TransitionSpec;
                                                                • Approximate configuration for activity open animation from Android 14. See https://android.googlesource.com/platform/frameworks/base/+/refs/tags/android-14.0.0_r51/core/res/res/anim/activity_open_enter.xml

                                                                variable FadeOutToBottomAndroidSpec

                                                                const FadeOutToBottomAndroidSpec: TransitionSpec;
                                                                • Configuration for activity close animation from Android Nougat. See http://aosp.opersys.com/xref/android-7.1.2_r37/xref/frameworks/base/core/res/res/anim/activity_close_exit.xml

                                                                variable FadeOutToLeftAndroidSpec

                                                                const FadeOutToLeftAndroidSpec: TransitionSpec;
                                                                • Approximate configuration for activity close animation from Android 14. See https://android.googlesource.com/platform/frameworks/base/+/refs/tags/android-14.0.0_r51/core/res/res/anim/activity_close_exit.xml

                                                                variable RevealFromBottomAndroidSpec

                                                                const RevealFromBottomAndroidSpec: TransitionSpec;
                                                                • Approximate configuration for activity open animation from Android Pie. See http://aosp.opersys.com/xref/android-9.0.0_r47/xref/frameworks/base/core/res/res/anim/activity_open_enter.xml

                                                                variable ScaleFromCenterAndroidSpec

                                                                const ScaleFromCenterAndroidSpec: TransitionSpec;
                                                                • Approximate configuration for activity open animation from Android Q. See http://aosp.opersys.com/xref/android-10.0.0_r2/xref/frameworks/base/core/res/res/anim/activity_open_enter.xml

                                                                variable TransitionIOSSpec

                                                                const TransitionIOSSpec: TransitionSpec;
                                                                • Exact values from UINavigationController's animation configuration.

                                                                Package Files (13)

                                                                Dependencies (3)

                                                                Dev Dependencies (14)

                                                                Peer Dependencies (6)

                                                                Badge

                                                                To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@react-navigation/stack.

                                                                • Markdown
                                                                  [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@react-navigation/stack)
                                                                • HTML
                                                                  <a href="https://www.jsdocs.io/package/@react-navigation/stack"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>