在React Native的底部选项卡导航器中更改屏幕时如何更改图标以及文本的颜色？
里查德59897
我正在开发一个应用程序，它的底部选项卡导航器中有三个屏幕。当我从一个屏幕转到另一个屏幕时，我已经能够更改标签颜色，但是，我也无法更改图标的颜色。这是到目前为止的样子的一个例子。
这是我控制此代码的App.js代码。我真的很感谢任何帮助或指导。在此先感谢您的帮助！
App.js：
function MainTabNavigator() {
return (
<Tab.Navigator
tabBarOptions={{
activeTintColor: '#e64951',
}}
>
<Tab.Screen options={{
headerShown: false, tabBarIcon: ({ tintColor }) => (
<Entypo name="home" size={30} color={tintColor} />
)
}} name="home" component={Home} />
<Tab.Screen options={{
headerShown: false, tabBarIcon: () => (
<FontAwesome5 name="plus" size={30} color="black" />
)
}} name="Add Friends" component={AddFriends} />
<Tab.Screen options={{
headerShown: false, tabBarIcon: ({ tintColor }) => (
<FontAwesome name="user" size={30} color={tintColor} />
)
}} name="Profile" component={Profile} />
</Tab.Navigator>
)
}
萨加（Sagar Shakya）
您将错误的论据传递给tabBarIconprop。您应该通过color而不是tintColor。
tabBarIcon: ({ color }) => (
<Entypo name="home" size={30} color={color} />
)
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
在React Native中更改React导航选项卡的底部栏容器颜色
- 2
如何在React Native底部选项卡中有条件地更改屏幕按钮？
- 3
如何在React Native底部选项卡中有条件地更改屏幕按钮？
- 4
嵌套在堆栈导航器中的React Native选项卡导航器
- 5
React-Native Navigation v5：如何在特定屏幕上更改tabBarLabel或tabBarIcon以及选项卡的colorBackground？
- 6
在React Native v.5中离开某个屏幕时，如何隐藏底部的标签导航器？
- 7
如何在React Native中的react选项卡导航中设置默认屏幕Route
- 8
在React Native中隐藏底部选项卡导航时收到警告
- 9
如何在React Navigation 5中更改选项卡图标之间的距离？
- 10
使用react-native单击时如何更改图像和文本颜色？
- 11
React Native-尝试在React导航中创建带有选项卡导航器的抽屉，而不渲染选项卡的Drawer项
- 12
在React Native Navigation中的选项卡之间切换时如何保持堆叠的屏幕
- 13
React ant design选项卡图标更改不同的状态
- 14
如何在React Native底部选项卡中处理后退按钮行为？
- 15
按下时在react native中更改文本的背景颜色
- 16
在 react-native-navigation (android) 中更改顶部选项卡字体系列
- 17
单击选项卡时如何更改图标？
- 18
在React Native中单击时如何使每个按钮更改颜色？
- 19
带选项卡导航的react-native抽屉导航
- 20
使用可滚动选项卡视图时从React Native图标切换到React Native矢量图标
- 21
选择选项卡并使中间的主选项卡时如何更改图标？
- 22
在 DrawerNagivation react-native 中更改活动菜单图标颜色
- 23
在react-native中更改顶部导航栏的颜色
- 24
React Native BottomTabs导航到特定选项卡
- 25
使用 redux 中保存的数据创建选项卡导航器（react-navigator）
- 26
使用选项卡栏和导航栏的React Native中的iOS 13黑暗模式
- 27
如何在React Navigation 4中显示选项卡栏图标
- 28
如何在React Native导航器中禁用向后滑动
- 29
如何在React Native中更改安全区域中项目的文本颜色？
我来说两句