49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import { BottomTabBarProps } from "@react-navigation/bottom-tabs";
|
|
import { CommonActions } from "@react-navigation/native";
|
|
import React from "react";
|
|
import { BottomNavigation } from "react-native-paper";
|
|
|
|
const TabBar = (props: BottomTabBarProps) => (
|
|
<BottomNavigation.Bar
|
|
shifting
|
|
navigationState={props.state}
|
|
safeAreaInsets={props.insets}
|
|
onTabPress={({ route, preventDefault }) => {
|
|
const event = props.navigation.emit({
|
|
type: "tabPress",
|
|
target: route.key,
|
|
canPreventDefault: true,
|
|
});
|
|
|
|
if (event.defaultPrevented) {
|
|
preventDefault();
|
|
} else {
|
|
props.navigation.dispatch({
|
|
...CommonActions.navigate(route.name, route.params),
|
|
target: props.state.key,
|
|
});
|
|
}
|
|
}}
|
|
renderIcon={({ route, focused, color }) => {
|
|
const { options } = props.descriptors[route.key];
|
|
if (options.tabBarIcon) {
|
|
return options.tabBarIcon({ focused, color, size: 24 });
|
|
}
|
|
|
|
return null;
|
|
}}
|
|
getLabelText={({ route }) => {
|
|
const { options } = props.descriptors[route.key];
|
|
const label =
|
|
options.tabBarLabel !== undefined
|
|
? (options.tabBarLabel as string)
|
|
: options.title !== undefined
|
|
? options.title
|
|
: route.name;
|
|
|
|
return label;
|
|
}}
|
|
/>
|
|
);
|
|
|
|
export default TabBar;
|