In general, the essence is as follows. Library react-native-router-flux It is necessary to remove the text under the icon in the TabBar:

enter image description here

But actually the router code:

const TabBar = ({focused}) => ( <View> <Icon name="search" type="MaterialIcons" style={{fontSize: 28, color: focused ? 'red': 'white'}} /> </View> ) export default () => ( <Router> <Scene hideNavBar> <Scene key="tabbar" tabs tabBarStyle={{backgroundColor: '#000'}}> <Scene key="list" title="Ahlo" component={List} hideNavBar icon={TabBar} /> <Scene key="search" component={search} hideNavBar icon={TabBar} /> <Scene key="account" component={account} hideNavBar icon={TabBar} /> </Scene> <Scene key="article" component={article} /> <Scene key="comment" component={comment} /> <Scene key="register" component={register} /> <Scene key="auth" component={auth} /> </Scene> </Router> )

    1 answer 1

    For this there is a property showLabel - you need to set it to False