NativeBase + Exponent Header

Question

指数でNativeBaseを使用しています。ヘッダーは、電話機のステータスバーの下に表示されます。これは、指数がリリースされたNativeBaseデモで確認できます。

誰もがこのための修正を持っていますか？

Answer 1

私はmarginTopにデバイスのStatusBarの値を追加しました。私のグローバルスタイルシートで

import { 
    StatusBar, 
} from 'react-native' 

：

header: { 
    marginTop: StatusBar.currentHeight, 
} 

Answer 2

私はフォルダ（ネイティブ・ベース・テーマ/コンポーネント）が見つかり、私のテーマにStyleProviderを使用してこれを処理するためのより良い方法を発見し、その後、解除成分へこの問題は、唯一のAndroidで起動しますのでHeader.jsファイルとは

Answer 3

（305行前後）paddintTop値を変更し、この問題を解決するために推奨される方法は、具体的プラットフォームを使用してアンドロイドをターゲットにするようになります：

import {Platform, StatusBar} from 'react-native' 

const styles = StyleSheet.create({ 
    container: { 
      flex: 1, 
      ...Platform.select({ 
       android: { 
        marginTop: StatusBar.currentHeight 
       } 
      }) 

     } 
}) 

ここで、コンテナはアプリのメインコンテナです。

<View style={{styles.container}}> 
// rest of the code here 
</View>