react-native - 在 react 导航标题下隐藏阴影

Question

我尝试使用 elevation 0 属性隐藏页眉阴影。

在 Android 10 上，它不起作用。标题是灰色的。在其他版本中，它可以工作。

我正在使用 React Navigation V5。

海拔高度为 0 的 Android 10:

没有提升 0 的 Android 10:

海拔高度为 0 的 Android 8.1:

我的代码:

<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>

Answer 1

试试这个设置。为我工作。

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