从createMaterialTopTabNavigator选项卡中移除activeOpacity

Question

在创建"材质顶部选项卡导航器"时，当从一个屏幕导航到另一个屏幕时，我希望将活动不透明度设置为零。我不知道如何做到这一点。我使用了activeopacity={0}，也知道我们可以禁用不透明度，但从哪里？感谢您帮助

import React from 'react';
import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';
import RecentNotifcation from '../Screens/RecentNotifcation';
import AllNotification from '../Screens/AllNotification';
import { COLORS } from '../Theme/theme';
const Tab = createMaterialTopTabNavigator();
export default function TopTab() {
return (
<Tab.Navigator screenOptions={{
tabBarActiveTintColor:"white",
tabBarLabelStyle: {
textTransform: "capitalize",
},
tabBarInactiveTintColor: "#616161",
tabBarIndicatorStyle: {
height: null,
top: '10%',
bottom: '10%',
borderRadius: 10,
backgroundColor: COLORS.headerColor,
},
tabBarStyle: {
alignSelf: "center",
width: '100%',
borderRadius: 10,
backgroundColor:  COLORS.pageBg,
elevation: 5, // shadow on Android

},
}}
>
<Tab.Screen name="All  Notification" component={AllNotification} />
<Tab.Screen name="Recent Notifcation" component={RecentNotifcation} />
</Tab.Navigator>
);}

这是我的代码

Answer 1

要删除不透明度反馈，可以在屏幕选项上传递tabBarPressOpacity: 1。代码如下：

// Rest of code above
export default function TopTab() {
return (
<Tab.Navigator
screenOptions={{
// ...
// Other screen options
// ...
tabBarPressOpacity: 1,
}}
>
<Tab.Screen name="All Notification" component={AllNotification} />
<Tab.Screen name="Recent Notifcation" component={RecentNotifcation} />
</Tab.Navigator>
);
}

您可以在文档中阅读更多关于Material Top Tabs Navigator和所有道具的信息。