Expo SDK 31 реагирует на навигацию BottomTabNavigator с иконками реагировать-native-svg не работает - PullRequest
Новая
       20

Expo SDK 31 реагирует на навигацию BottomTabNavigator с иконками реагировать-native-svg не работает

2 голосов
/ 07 марта 2019

Я использую реагировать-нативно-SVG для создания значков во всем приложении, в том числе для навигаторов по вкладкам.Все работало нормально, пока я не обновил Expo SDK 30 до SDK 31 (та же проблема сохраняется в SDK 32).

Кажется, что значок последней вкладки перекрывает другие, не давая пользователю перейти на любую вкладку, кромепрошлой.Очень точное нажатие на нижний или верхний край каждого значка вызывает ожидаемое поведение при навигации, но кажется, что 99% области вкладок покрывается последним значком вкладки.

Навигатор: 

// imports

const AppNavigator = createStackNavigator(
  {
    AppTab: {
      screen: createBottomTabNavigator(
        {
          ScreenOne: {
            screen: ScreenOne,
            navigationOptions: {
              tabBarIcon: ({ tintColor }) => <ScreenOneIcon stroke={tintColor} fill={tintColor} />
            }
          },
          ScreenTwo: {
            screen: ScreenTwo,
            navigationOptions: {
              tabBarIcon: ({ tintColor }) => <ScreenTwoIcon stroke={tintColor} fill={tintColor} />
            }
          },
          ScreenThree: {
            screen: ScreenThree,
            navigationOptions: {
              tabBarIcon: ({ tintColor }) => <ScreenThreeIcon stroke={tintColor} fill={tintColor} />
            }
          },
        },
        {
          initialRouteName: 'ScreenOne',
          headerMode: 'none',
          tabBarOptions: {
            showLabel: false,
            activeTintColor: colors.blue,
            inactiveTintColor: colors.gray0,
            style: {backgroundColor: colors.gray2},
          }
        }
      )
    },
    // other navigators
  },
  {
    initialRouteName: 'AppTab',
    headerMode: 'none'
  }
)

export default createAppContainer(AppNavigator)

Значок (все по одной схеме): 

import React from 'react'
import Svg,{G, Path} from 'react-native-svg'

export default class Icon extends React.Component {
  render() {
    return(
      <Svg viewBox='0 0 1000 1000' height='100%' width='100%'>
        <G fill={this.props.fill} stroke={this.props.stroke} strokeWidth={25}>
          <Path d="" />
          <Path d="" />
       </G>
     </Svg>
    )
  }
}
...