iPhone X로 SafeAreaView의 상단과 하단에 다른 색상을 갖는 방법
Nov 26 2020
이 질문 은 이미 답변 되었지만 제안 된 솔루션이 더 이상 작동하지 않습니다.
return (
<Fragment>
<SafeAreaView style={{ flex:0, backgroundColor: 'red' }} />
<SafeAreaView style={{ flex:1, backgroundColor: 'gray' }}>
<View style={{ flex: 1, backgroundColor: 'white' }} />
</SafeAreaView>
</Fragment>
);
나에게 줄 것 :

대신 제공 :

보시다시피보기 순서는 동일하지 않습니다.
iOS에서도 같은 문제가 있습니다.
나는 react을 사용 16.13.1
하고 있습니다. 아마도 마지막 답변 이후로 변경된 것이 있습니까?
내 대안은 무엇입니까?
감사
답변
1 MoreFoam Nov 26 2020 at 04:26
다음은 React 16.13.1을 사용하여 나를 위해 일했습니다.
return (
<Fragment>
<SafeAreaView style={{flex: Platform.OS === "android" ? 0.03 : 0, backgroundColor: "red"}}/>
<View style={{flex: 1, backgroundColor: "white"}}/>
<SafeAreaView style={{flex: Platform.OS === "android" ? 0.03 : 0, backgroundColor: "gray"}}/>
</Fragment>
);
iOS 스크린 샷 :

Android 스크린 샷 :

LuckyPal Nov 26 2020 at 04:55
내 경험상 StatusBar
에서 react-native
나를 위해 잘 작동했습니다. 예:
import { StatusBar } from 'react-native';
return (<Fragment>
<StatusBar
backgroundColor="#f00"
barStyle="light-content"
/>
<Fragment>);
건배.