How to add text above the image? - react-native

Question

I use react-native-swiper and i want to add a text above my image.
I try to set style container image paragraph, it is still not working.
What should i do about the style setting ?
Any help would be appreciated. Thanks in advance.
import React, { Component } from 'react';
import { View, Text, Image, Dimensions } from 'react-native';
import Swiper from 'react-native-swiper';
const dimensions = Dimensions.get('window').width;
class About extends Component {
render() {
return (
<View style={{ flex: 1 }}>
<Swiper
style={styles.wrapper}
height={200}
paginationStyle={{bottom: 10}}
>
<View style={styles.container}>
<Image style={styles.image} source={require('../img/home_service_bg1.jpg')} />
<Text style={styles.paragraph}>How to let me show above the img.</Text>
</View>
<View style={{ flex: 1 }}>
<Image source={require('../img/home_service_bg2.jpg')} style={styles.img}/>
</View>
</Swiper>
<View style={{ flex: 2 }}>
<Text>Hi</Text>
</View>
</View>
);
}
}
const styles = {
wrapper: {
},
container: {
flex: 1,
alignItems: 'stretch',
justifyContent: 'center',
},
image: {
flexGrow:1,
height:null,
width:null,
alignItems: 'center',
justifyContent:'center',
},
paragraph: {
textAlign: 'center',
},
};
export default About;
Here is my situation now:
I hope it becomes like this:

Answer 1

position="absolute" will make it work as Android RelativeLayout.
If you want set view on top set marginTop to 0.
After seeing your requirement. You can simply use ImageBackground
<ImageBackground source={...} style={{width: '100%', height: '100%'}}>
<Text>Inside</Text>
</ImageBackground>
See facebook docs