React Nativeの他の画像の上に画像を配置するには？

Question

イメージをルートノードとして配置し、ビューの背景にしました。しかし、他のすべての画像が見えなくなるようです... プラグインなしで組み込みコンポーネントを使用して画像を背景の上に置く方法はありますか？
次のコードサンプルlanding-backgroundをバックグラウンドとして使用すると、logoイメージが表示されますが、背景が削除されている場合のみ表示されます。
Textが

<View style={styles.container}> 
      <Image source = {require('./img/landing-background.jpg')} 
       resizeMode = 'cover' style = {styles.backdrop}> 
       <View style = {styles.overlay}> 
       <Text style = {styles.headline}>It should appear in front of the Background Image</Text> 
    <Image style = {styles.logo} source = {require('./img/logo.png')} /> 
       </View> 

       </Image> 
    </View> 

var styles = StyleSheet.create({ 
     container: { 
     flex: 1, 
     alignItems: 'center', 
     }, 
     overlay: { 
     opacity: 0.5, 
     backgroundColor: '#000000' 
     }, 
     logo: { 
     backgroundColor: 'rgba(0,0,0,0)', 
     width: 160, 
     height: 52 
     }, 
     backdrop: { 
     flex:1, 
     flexDirection: 'column' 
     }, 
     headline: { 
     fontSize: 18, 
     textAlign: 'center', 
     backgroundColor: 'rgba(0,0,0,0)', 
     color: 'white' 
     } 
    }); 

Answer 1

よりもむしろ<Image>であなたのコンテンツをラップ...任意の懸念なしに、バックグラウンドの最上部に表示されている、私はあなたがabsolute LY位置付け要素にすることをラップし、そのストレッチを持ったほうが良いと思いますスクリーンを覆う。

<View style={styles.container}> 
    <View style = {styles.backgroundContainer}> 
    <Image source = {require('./img/landing-background.jpg')} resizeMode = 'cover' style = {styles.backdrop} /> 
    </View> 
    <View style = {styles.overlay}> 
    <Text style = {styles.headline}>It should appear in front of the Background Image</Text> 
    <Image style = {styles.logo} source = {require('./img/logo.png')} /> 
    </View> 
</View> 

var styles = StyleSheet.create({ 
    backgroundContainer: { 
    position: 'absolute', 
    top: 0, 
    bottom: 0, 
    left: 0, 
    right: 0, 
    }, 
    container: { 
    flex: 1, 
    alignItems: 'center', 
    }, 
    overlay: { 
    opacity: 0.5, 
    backgroundColor: '#000000' 
    }, 
    logo: { 
    backgroundColor: 'rgba(0,0,0,0)', 
    width: 160, 
    height: 52 
    }, 
    backdrop: { 
    flex:1, 
    flexDirection: 'column' 
    }, 
    headline: { 
    fontSize: 18, 
    textAlign: 'center', 
    backgroundColor: 'black', 
    color: 'white' 
    } 
});