Question

我已经完成了TopTabNavigator，并在“一个”选项卡上设置了背景。我想知道当此选项卡处于非活动状态时如何去除不透明性。

无论是否专注，我都试图用相同的backgroundColor做一个条件。

有人可以指导我如何解决这个问题吗？

 tabBarLabel: ({focused}) => (
  focused ? 
  <View 
  style={{backgroundColor:'#FF6D70', height: 30, width: 60, justifyContent: 'center', 
  borderBottomLeftRadius: 10, borderBottomRightRadius: 10, marginLeft: 1}}>
    <Text style={{color:'white', fontSize: 10, textAlign: 'center'}}>dashboard</Text>
  </View> : 
    <View 
    style={{backgroundColor:'#FF6D70', height: 30, width: 60, justifyContent: 'center', 
    borderBottomLeftRadius: 10, borderBottomRightRadius: 10, marginLeft: 1}}>
      <Text style={{color:'white', fontSize: 10, textAlign: 'center'}}>dashboard</Text>
    </View> ),

Answer 1

选中此React Navigation。在 tabBarOptions 下有一个名为 pressOpacity 的属性。可能对您有帮助。

createMaterialTopTabNavigator({ /** Screens */ }, {
  tabBarOptions:{
     pressOpacity: 1 // Some value for pressed tab
     ... // Other Options
  }
  ... // Other Options
});

无效的标签不透明度（materialTopTabnavigator）

1 个答案: