React Native - イメージの上にアイコンを配置できません

Question

イメージの上にアイコンを配置しようとしていますが、イメージをページの下に押しているだけです。

私はあなたが見ることができるように、その画像の上にブルーバックの矢印を配置しようとしている：ここで

は、それが現在のようになります。ここで

は私のマークアップは次のようになります。

<ScrollView style={ styles.container }> 
    <View style={ styles.coverImageContainer }> 
    <Image 
     style={ styles.coverImage } 
     source={ require('./img.jpg') } 
    > 
     <View> 
     <Ionicons name="ios-arrow-back" color="#4F8EF7" size={25} /> 
     </View> 
    </Image> 
    </View> 
    ... 

そして、ここでは私のスタイルです：私は間違って

container: { 
    backgroundColor: '#f9f9f9', 
    flex: 1, 
}, 

coverImageContainer: { 
    backgroundColor: '#000', 
}, 

coverImage: { 
    width: null, 
    height: 170, 
    resizeMode: 'cover', 
    opacity: 0.7, 
    flex: 1, 
}, 

何をしているのですか？

アイコンを削除すると、画像に表示される方法が表示されますが、その上に戻るボタンアイコンも表示されます。ここでは、アイコンなしで次のようになります。

Answer 1

P矢印移動するためのmarginTop: 22を追加コンポーネントは一切ありません。

<Ionicons name="ios-arrow-back" color="#4F8EF7" size={25} style={{ position: 'absolute', top: 30, left: 10 }} /> 

Answer 2

ステータスバーは、[戻る]ボタンでposition:'absolute'; zIndex: 99999を使用している場合でも、インクルードは2通りあり、常に表示されます：<StatusBar hidden={true}/>を追加することで、ステータスバーを削除

2. レンダリングの内側に少し下向き