Скрыть тень под заголовком react-navigation

#react-native #react-navigation

#react-native #react-навигация

Вопрос:

Я попытался скрыть тень заголовка, используя атрибут elevation 0.

На Android 10 это не работает. Заголовок серый. В других версиях это работает.

Я использую React Navigation V5.

Android 10 с повышением прав 0:

введите описание изображения здесь

Android 10 без прав доступа 0: введите описание изображения здесь

Android 8.1 с повышением прав 0: введите описание изображения здесь

Мой код:

 <Stack.Navigator>
      <Stack.Screen
        name="DiscountsReleaseDetail"
        component={DiscountsReleaseDetail}
        options={({ navigation, route }) => {
          const { numSeq, codMaquina } = route.params.order;
          return {
            headerTitle: `Pedido ${numSeq}/${codMaquina}`,
            headerTitleAlign: 'center',
            headerBackTitleVisible: false,
            headerTintColor: '#fff',
            headerStyle: {
              backgroundColor: colorCompany,
              shadowOpacity: 0, // remove shadow on iOS
              elevation: 0, // remove shadow on Android
            },
            headerLeft: () => (
              <HeaderButtonBack
                onPress={() => {
                  navigation.reset({
                    index: 0,
                    routes: [{ name: 'DiscountsRelease' }],
                  });
                }}
              />
            ),
          };
        }}
      />
</Stack.Navigator>
  

Комментарии:

1. Возможно, это проблема с самой библиотекой, я предлагаю открыть новую проблему в репозитории GitHub

Ответ №1:

попробуйте эту настройку. сработало для меня.

 headerStyle: {
backgroundColor: "black",
shadowOpacity: 0,
shadowOffset: {
    height: 0,
},
shadowRadius: 0,
elevation: 0}