123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899 |
- /*
- * Copyright (c) 2019 - 2020 Arnaud Vergnet.
- *
- * This file is part of Campus INSAT.
- *
- * Campus INSAT is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * Campus INSAT is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
- */
-
- import * as React from 'react';
- import {useTheme} from 'react-native-paper';
- import {createCollapsibleStack} from 'react-navigation-collapsible';
- import StackNavigator, {StackNavigationOptions} from '@react-navigation/stack';
- import {StackNavigationState, TypedNavigator} from '@react-navigation/native';
- import {StackNavigationEventMap} from '@react-navigation/stack/lib/typescript/src/types';
-
- type StackNavigatorType = import('@react-navigation/native').TypedNavigator<
- Record<string, object | undefined>,
- StackNavigationState,
- StackNavigationOptions,
- StackNavigationEventMap,
- typeof StackNavigator
- >;
-
- /**
- * Creates a navigation stack with the collapsible library, allowing the header to collapse on scroll.
- *
- * Please use the getWebsiteStack function if your screen uses a webview as their main component as it needs special parameters.
- *
- * @param name The screen name in the navigation stack
- * @param Stack The stack component
- * @param component The screen component
- * @param title The screen title shown in the header (needs to be translated)
- * @param useNativeDriver Whether to use the native driver for animations.
- * Set to false if the screen uses a webview as this component does not support native driver.
- * In all other cases, set it to true for increase performance.
- * @param options Screen options to use, or null if no options are necessary.
- * @param headerColor The color of the header. Uses default color if not specified
- * @returns {JSX.Element}
- */
- export function CreateScreenCollapsibleStack(
- name: string,
- Stack: TypedNavigator<any, any, any, any, any>,
- component: React.ComponentType<any>,
- title: string,
- useNativeDriver: boolean = true,
- options: StackNavigationOptions = {},
- headerColor?: string,
- ) {
- const {colors} = useTheme();
- return createCollapsibleStack(
- <Stack.Screen
- name={name}
- component={component}
- options={{
- title,
- headerStyle: {
- backgroundColor: headerColor != null ? headerColor : colors.surface,
- },
- ...options,
- }}
- />,
- {
- collapsedColor: headerColor != null ? headerColor : colors.surface,
- useNativeDriver: useNativeDriver, // native driver does not work with webview
- },
- );
- }
-
- /**
- * Creates a navigation stack with the collapsible library, allowing the header to collapse on scroll.
- *
- * This is a preset for screens using a webview as their main component, as it uses special parameters to work.
- * (aka a dirty workaround)
- *
- * @param name
- * @param Stack
- * @param component
- * @param title
- * @returns {JSX.Element}
- */
- export function getWebsiteStack(
- name: string,
- Stack: TypedNavigator<any, any, any, any, any>,
- component: React.ComponentType<any>,
- title: string,
- ) {
- return CreateScreenCollapsibleStack(name, Stack, component, title, false);
- }
|