7

現在の動作

皆さんこんにちは、

下のタブの背景色を設定したい。なので以下のようにしました。

<Tab.Navigator
      tabBarOptions={{
        activeTintColor: '#FF0000',
        activeBackgroundColor: '#FFFFFF',
        inactiveBackgroundColor: '#FF0000',
        inactiveTintColor:  '#FFFFFF'
      }}>
      <Tab.Screen
        name="Home"
        component={HomeScreen}
      />
      <Tab.Screen
        name="Account"
        component={AccountScreen}
      />
    </Tab.Navigator>

https://user-images.githubusercontent.com/6939811/76062160-b6dfde00-5fb7-11ea-8808-3f2562e90c24.png

問題は、セーフエリアの背景が白いことです

予想される行動

私が期待しているのは https://user-images.githubusercontent.com/6939811/76062716-cca1d300-5fb8-11ea-926a-acbd42d412dd.png

React Navigation バージョン 5 でこの問題を解決する方法を教えてください。ありがとうございました！

あなたの環境

iOS 反応ネイティブ: 0.61.5

@反応ナビゲーション/ネイティブ: ^5.0.5

@react-navigation/bottom-tabs: ^5.0.5

4

3 に答える 3

1

この回答でオプションを見つけました (私は好きではありませんが、機能します): How do you make the react-native react-navigation tab bar transparent

<Tab.Navigator
      tabBarOptions={{
        showLabel: false,
        activeTintColor: theme.primary,
        inactiveTintColor: theme.tintInactiveTabBar,
        style: {
          backgroundColor: theme.backgroundTabBar,
          position: 'absolute',
          left: 0,
          bottom: 0,
          right: 0,
          borderTopRightRadius: 10,
          borderTopLeftRadius: 10,
        },
      }}>...</Tab.Navigator>

配置位置:絶対と下、左と右の属性。わたしにはできる。

于 2020-03-31T07:46:22.617 に答える