fix: don't hide child header automatically in stack

This commit is contained in:
Satyajit Sahoo
2020-11-07 14:39:23 +01:00
parent 7de6677e72
commit 8f0efc8db5
5 changed files with 29 additions and 22 deletions

View File

@@ -86,12 +86,18 @@ export default function BottomTabsScreen({
>
<BottomTabs.Screen
name="Article"
component={SimpleStackScreen}
options={{
title: 'Article',
tabBarIcon: getTabBarIcon('file-document-box'),
}}
/>
>
{(props) => (
<SimpleStackScreen
{...props}
screenOptions={{ headerShown: false }}
/>
)}
</BottomTabs.Screen>
<BottomTabs.Screen
name="Chat"
component={Chat}

View File

@@ -23,13 +23,19 @@ export default function MaterialBottomTabsScreen() {
<MaterialBottomTabs.Navigator barStyle={styles.tabBar}>
<MaterialBottomTabs.Screen
name="Article"
component={SimpleStackScreen}
options={{
tabBarLabel: 'Article',
tabBarIcon: 'file-document-box',
tabBarColor: '#C9E7F8',
}}
/>
>
{(props) => (
<SimpleStackScreen
{...props}
screenOptions={{ headerShown: false }}
/>
)}
</MaterialBottomTabs.Screen>
<MaterialBottomTabs.Screen
name="Chat"
component={Chat}

View File

@@ -4,6 +4,7 @@ import { Button } from 'react-native-paper';
import type { ParamListBase } from '@react-navigation/native';
import {
createStackNavigator,
StackNavigationOptions,
StackScreenProps,
} from '@react-navigation/stack';
import Article from '../Shared/Article';
@@ -105,7 +106,10 @@ const SimpleStack = createStackNavigator<SimpleStackParams>();
export default function SimpleStackScreen({
navigation,
}: StackScreenProps<ParamListBase>) {
screenOptions,
}: StackScreenProps<ParamListBase> & {
screenOptions?: StackNavigationOptions;
}) {
React.useLayoutEffect(() => {
navigation.setOptions({
headerShown: false,
@@ -113,7 +117,7 @@ export default function SimpleStackScreen({
}, [navigation]);
return (
<SimpleStack.Navigator>
<SimpleStack.Navigator screenOptions={screenOptions}>
<SimpleStack.Screen
name="Article"
component={ArticleScreen}

View File

@@ -15,7 +15,6 @@ import {
forNoAnimation,
forSlideRight,
} from '../../TransitionConfigs/HeaderStyleInterpolators';
import HeaderShownContext from '../../utils/HeaderShownContext';
import PreviousSceneContext from '../../utils/PreviousSceneContext';
import type {
Layout,
@@ -56,7 +55,6 @@ export default function HeaderContainer({
style,
}: Props) {
const focusedRoute = getFocusedRoute();
const isParentHeaderShown = React.useContext(HeaderShownContext);
const parentPreviousScene = React.useContext(PreviousSceneContext);
return (
@@ -66,11 +64,8 @@ export default function HeaderContainer({
return null;
}
const {
header,
headerShown = isParentHeaderShown === false,
headerTransparent,
} = scene.descriptor.options || {};
const { header, headerShown = true, headerTransparent } =
scene.descriptor.options || {};
if (!headerShown) {
return null;
@@ -85,11 +80,10 @@ export default function HeaderContainer({
const previousScene = self[i - 1];
const nextScene = self[i + 1];
const {
headerShown: previousHeaderShown = isParentHeaderShown === false,
} = previousScene?.descriptor.options || {};
const { headerShown: previousHeaderShown = true } =
previousScene?.descriptor.options || {};
const { headerShown: nextHeaderShown = isParentHeaderShown === false } =
const { headerShown: nextHeaderShown = true } =
nextScene?.descriptor.options || {};
const isHeaderStatic =

View File

@@ -447,10 +447,7 @@ export default class CardStack extends React.Component<Props, State> {
? this.state.scenes.slice(-2).some((scene) => {
const { descriptor } = scene;
const options = descriptor ? descriptor.options : {};
const {
headerTransparent,
headerShown = isParentHeaderShown === false,
} = options;
const { headerTransparent, headerShown = true } = options;
if (headerTransparent || headerShown === false) {
return true;
@@ -542,7 +539,7 @@ export default class CardStack extends React.Component<Props, State> {
const {
safeAreaInsets,
headerShown = isParentHeaderShown === false,
headerShown = true,
headerTransparent,
cardShadowEnabled,
cardOverlayEnabled,