Мерцание белого цвета между экранами в createMaterialTopnavigator React Navigation v5 - PullRequest
Новая
       15

Мерцание белого цвета между экранами в createMaterialTopnavigator React Navigation v5

2 голосов
/ 07 апреля 2020

Во время пролистывания между экранами между экранами в MaterialTopNavigator наблюдается белое мерцание. Существует навигатор с выдвижными ящиками, который вкладывает навигатор по стеку, который дополнительно вкладывает навигатор по вкладкам.

Код TabView (где происходит flickr) 

const TabView = createMaterialTopTabNavigator();
export const MyTabView = props => {
  return (
    <TabView.Navigator
      initialLayout={{ width: Dimensions.get('window').width, backgroundColor: '#121212' }}
      tabBarOptions={{
        activeTintColor: '#FF8458',
        inactiveTintColor: '#FF845840',
        labelStyle: {
          fontSize: 12,
          fontStyle: 'italic',
          fontWeight: 'bold'
        },
        style: { backgroundColor: '#361B0F' },
        indicatorStyle: { backgroundColor: '#FF845880' }
      }}
    >
      <TabView.Screen name="Movies" component={DashBoard} />
      <TabView.Screen name="TVShows" component={TvShowTab} />
    </TabView.Navigator>
  );
}

1 Ответ

0 голосов
/ 08 апреля 2020

Передавая цвет фона в материале sceneContainerStyleContainer, стиль пропеллера исправил 90% мерцания. 

export const MyTabView = props => {
  return (
    <TabView.Navigator
      initialLayout={{ width: Dimensions.get('window').width, backgroundColor: '#121212' }}
      sceneContainerStyle={{
        backgroundColor: '#361B0F',
      }}
      tabBarOptions={{
        activeTintColor: '#FF8458',
        inactiveTintColor: '#FF845840',
        labelStyle: {
          fontSize: 12,
          fontStyle: 'italic',
          fontWeight: 'bold'
        },
        tabStyle: {

        },
        style: { backgroundColor: '#361B0F', },
        indicatorStyle: { backgroundColor: '#FF845880' }
      }}
    >
      <TabView.Screen name="Movies" component={DashBoard} />
      <TabView.Screen name="TVShows" component={TvShowTab} />
    </TabView.Navigator>
  );
}//MyTabView
...