Я хочу задать вопрос о плавающем tabBarIcon
. Пример кода такой же, как описанный в этом примере. Реактивная навигационная вкладка, крупный значок посередине
Просто одно препятствие, которое меня так сильно раздражало, - это значок, который пересекает верхнюю границу панели вкладок, не имеет возможности перемещаться, хотя это было нажато. Таким образом, похоже, что созданная вкладка не работает.
это из моей версии плавающего TabBarIcon
//... other code
const UpdateStack = createStackNavigator(
{
Update: UpdateScreen
},
{
mode: 'modal',
headerMode: 'none'
}
);
UpdateStack.navigationOptions = {
tabBarIcon: ({ tintColor }) => (
<TouchableOpacity
style={{
height: 60,
width: 60,
backgroundColor: '#ffff',
borderRadius: 30,
top: -13,
justifyContent: 'center',
alignItems: 'center',
elevation: 10
}}>
<Ionicons
name='ios-add-circle'
size={60}
style={{
color: tintColor
}}
/>
</TouchableOpacity>
),
tabBarLabel: 'Update'
};
//... other code
const mainTabNavigator = createBottomTabNavigator(
{
HomeStack,
MemberStack,
UpdateStack,
NotifStack,
ProjectsStack
},
{
initialRouteName: 'UpdateStack',
tabBarOptions: {
style: {
borderTopWidth: 0,
borderTopColor: '#1A3665',
backgroundColor: '#ffffff',
height: 60,
borderTopRightRadius: 20,
borderTopLeftRadius: 20,
position: 'absolute',
bottom: 0,
left: 0,
right: 0,
elevation: 10
},
activeTintColor: '#006be6',
inactiveTintColor: '#262b73'
},
backBehavior: 'history'
}
);
//... other code