React Navigation 헤더 아래의 경계선 지우기

전제


  • ReactNative 0.61.4
  • react-navigation v5

  • 문제



    헤더와 컴퍼넌트가 연속해 하나로 보이는, 이하와 같은 디자인을 구현하고 싶지만,
    경계의 흰색 선이 지울 수 없습니다.



    도대체 어디를 만지면 좋을까.

    방법


    shadowColor: 'transparent'를 headerStyle로 설정하면 사라집니다.

    ※추기(Android는 이것도 필요했습니다.)elevation: 0를 headerStyle로 설정하면 사라집니다.

    만약 코드는
    
    <NavigationContainer theme={Theme}>
         <Stack.Screen
              name={screen}
              component={Screen}
              options={{
                title: 'Header Title',
                headerStyle: {
                  shadowColor: 'transparent', //ここ(iOS)
                  shadowOpacity: 0, // ここ(iOSはこちらでも可)
                  elevation: 0, // ここ(Android)
                },
              }}
            />
          </Stack.Navigator>
    </NavigationContainer>
    

    참고 기사


  • htps : // 기주 b. 코 m / Rea ct-na-ga Chion / Rea ct-na-ga Chion / Issue s / 865
  • h tps : // s t c ゔ ぇ rf ぉ w. 코 m / 쿠에 s 치온 s / 42709730 / HO W-D-I-Hide-Te-- W w 응 r-re ct- ゔ ぃ 가 치온
  • 좋은 웹페이지 즐겨찾기