reactjs - 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,
},

私は何を間違っていますか？

アイコンを削除すると、画像は希望どおりに表示されますが、その上に戻るボタンのアイコンも表示したいと思います。アイコンがない場合は次のようになります。