|
|
@@ -138,23 +138,40 @@ render() { |
|
|
|
<ImageBackground style={styles.container} |
|
|
|
source={require('./image/background.png')}> |
|
|
|
|
|
|
|
|
|
|
|
<View style={styles.title}> |
|
|
|
<View style={styles.titleImagePlace}> |
|
|
|
<Image source={require('./image/title.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
</View> |
|
|
|
<Image source={require('./image/title-qrcode.png')} resizeMode='center' style={styles.titleQrcode} /> |
|
|
|
</View> |
|
|
|
|
|
|
|
|
|
|
|
<View style={styles.content}> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.contentItem} /> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.contentItem} /> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.contentItem} /> |
|
|
|
</View> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<View style={styles.bottom}> |
|
|
|
<Image source={require('./image/logo.png')} resizeMode='center' style={styles.bottomLogo} /> |
|
|
|
<Image source={require('./image/test-l.png')} resizeMode='center' style={styles.bottomQrcode1} /> |
|
|
|
<Image source={require('./image/test-l.png')} resizeMode='center' style={styles.bottomQrcode2} /> |
|
|
|
<Text style={styles.bottomPlacehold}></Text> |
|
|
|
</View> |
|
|
|
|
|
|
|
</ImageBackground> |
|
|
|
); |
|
|
|
|
|
|
@@ -162,11 +179,15 @@ render() { |
|
|
|
} |
|
|
|
|
|
|
|
const styles = StyleSheet.create({ |
|
|
|
|
|
|
|
//layer background |
|
|
|
container:{ |
|
|
|
flex: 1, |
|
|
|
paddingLeft: 16, |
|
|
|
paddingRight: 16 |
|
|
|
}, |
|
|
|
|
|
|
|
//layer top |
|
|
|
title:{ |
|
|
|
flex: 6, |
|
|
|
flexDirection: 'row', |
|
|
@@ -185,39 +206,60 @@ render() { |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
|
|
|
|
//layer title |
|
|
|
titleImagePlace: { |
|
|
|
flex: 2, |
|
|
|
paddingTop: '20%', |
|
|
|
paddingLeft: '10%', |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
titleImage: { |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
flex: 1, |
|
|
|
alignItems:'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
titleQrcode: { |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
flex: 1, |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
|
|
|
|
//layer bottom |
|
|
|
bottomLogo: { |
|
|
|
flex: 2, |
|
|
|
alignItems: 'center', |
|
|
|
flex: 50, |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomQrcode1: { |
|
|
|
flex: 1, |
|
|
|
alignItems: 'center', |
|
|
|
flex: 30, |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomQrcode2: { |
|
|
|
flex: 1, |
|
|
|
alignItems: 'center', |
|
|
|
flex: 30, |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomPlacehold: { |
|
|
|
flex: 6, |
|
|
|
flex: 180, |
|
|
|
width:'100%', |
|
|
|
height:'100%', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
|
|
|
|
//layer content item |
|
|
|
contentItem:{ |
|
|
|
flex: 1, |
|
|
|
flexDirection: 'column', |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
}); |