react-native - 为 createMaterialTopTabNavigator 调用键盘时隐藏选项卡栏作为底部选项卡导航器实现

Question

大家好，我正在使用 React Navigation 5 createMaterialTopTabNavigator，Bottom Navigation setup因为我需要 Material Top Navigator 提供的滑动过渡，但与 不同createBottomTabNavigator的是，Material Top没有 a keyboardHidesTabBar，因此我可以确保在键盘打开时隐藏标签栏，但这就是我想要实现的目标（https://material.io/components/bottom-navigation#placement）。
还有其他方法可以完成这样的事情吗？

这是当前可以玩的小吃：https ://snack.expo.io/qTDqLo1eb

这是代码：

import * as React from 'react';
import { Text, View, TextInput } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';
import { MaterialCommunityIcons } from '@expo/vector-icons';

function HomeScreen() {
  const [text, onChangeText] = React.useState("Useless Text");
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Home!</Text>
      <TextInput
        onChangeText={onChangeText}
        value={text}
      />
    </View>
  );
}

function SettingsScreen() {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Settings!</Text>
    </View>
  );
}

const Tab = createMaterialTopTabNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator tabBarPosition='bottom'
      tabBarOptions={{
        // style: { position: 'absolute', bottom:0 },
        activeTintColor: '#e91e63',
        inactiveTintColor: '#ee11ff',
        showIcon: true,
        indicatorStyle:{
          height:0
        }
      }}>
        <Tab.Screen
        options={{
          tabBarLabel: 'Home',
          tabBarIcon: ({ color, size }) => (
            <MaterialCommunityIcons name="home" color={color} size={24} />
          ),
        }} name="Home" component={HomeScreen} />
        <Tab.Screen
        options={{
          tabBarLabel: 'Profile',
          tabBarIcon: ({ color, size }) => (
            <MaterialCommunityIcons name="account" color={color} size={24} />
          ),
        }} name="Settings" component={SettingsScreen} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}