如何在反应导航标签栏内添加图片？

Question

我正在使用react-navigation，我可以在其上创建带有文本标题的选项卡栏。我想在它们上面显示图像而不是文本。有没有办法做到这一点？

这是我正在使用的代码，但它不起作用。任何关于如何正确使用它的建议？

static navigationOptions = { 
    tabBarIcon: (
    <Image style={{ width: 50, height: 50 }} 
     source={require('./../images/Logo.jpg')} /> 
) 

}

Answer 1

尝试使用函数来代替：

static navigationOptions = { 
    tabBarIcon: (focused, tintColor) => (
     <Image style={{ width: 50, height: 50 }} 
      source={require('./../images/Logo.jpg')} /> 
    ) 
} 

Answer 2

根据该文档，在showIcon属性被设置好的到在Android（https://reactnavigation.org/docs/navigators/tab#tabBarOptions-for-TabBarTop-default-tab-bar-on-Android）假。

你试过把它设置为真吗？

static navigationOptions = { 
    tabBarOptions: { showIcon: true, } 
    tabBarIcon: ({ tintColor }) => { 
       return (<Image 
        style={{ width: 50, height: 50 }} 
        source={{ uri: "https://facebook.github.io/react/img/logo_og.png" }}/>);} 
    } 
}