I’m facing a problem with my Bottom Tab Navigator. I get a white space between my tabs and the end of the screen of my iPhone 11 Simulator. On a iPhone 8 Simulator I don’t have these white space. There is also a small white space above the Tabs. How can I remove this space? I’m not able to find a solution and I’m running out of time. Thanks!
This is my implementation so far:
DetailsNavigation.js
JavaScript
x
39
39
1
const DetailsNavigation = ({ route }) => {
2
return (
3
<Tab.Navigator
4
tabBarOptions={{
5
activeBackgroundColor: colors.primary,
6
activeTintColor: colors.secondary,
7
inactiveBackgroundColor: colors.secondary,
8
inactiveTintColor: colors.primary,
9
labelStyle: {
10
fontSize: 13,
11
marginBottom: 5,
12
},
13
}}
14
>
15
<Tab.Screen
16
name="DetailsScreen"
17
options={{
18
title: "Portfolio",
19
tabBarIcon: ({ color, size }) => (
20
<MaterialIcons name="account-box" size={24} color={color} />
21
),
22
}}
23
children={() => <DetailsScreen worker={route.params} />}
24
/>
25
<Tab.Screen
26
name="RatingScreen"
27
component={RatingScreen}
28
options={{
29
title: "Bewertungen",
30
tabBarIcon: ({ color, size }) => (
31
<MaterialIcons name="star" size={24} color={color} />
32
),
33
}}
34
/>
35
</Tab.Navigator>
36
);
37
};
38
export default DetailsNavigation;
39
DetailsNavigation.js is implemented here:
WorkersNavigation.js
JavaScript
1
24
24
1
const WorkersNavigation = (props) => {
2
return (
3
<Stack.Navigator>
4
<Stack.Screen
5
name="WelcomeScreen"
6
component={WelcomeScreen}
7
options={{ headerShown: false }}
8
></Stack.Screen>
9
<Stack.Screen
10
name="WorkersScreen"
11
component={WorkersScreen}
12
options={{ headerShown: false }}
13
></Stack.Screen>
14
<Stack.Screen
15
name="DetailsNavigation"
16
component={DetailsNavigation}
17
options={{ headerShown: false }}
18
></Stack.Screen>
19
</Stack.Navigator>
20
);
21
};
22
23
export default WorkersNavigation;
24
Advertisement
Answer
I think you are wrap outside of WorkersNavigation like this
JavaScript
1
4
1
<SafeAreaView>
2
<WorkersNavigation />
3
</SafeAreaView>
4