kangaroo/js/page/PassMode.js

import React, { Component } from "react"
import { StyleSheet, Text, View, Image } from "react-native"
import { unitWidth, unitHeight } from "../utils/AdapterUtil";

export default class PassMode extends Component {
	render() {
		return (
			<View style={styles.container}>
				<View style={{ alignItems: "center", marginBottom: unitHeight * 60 }}>
					<Image
						source={require("../../static/passSuccess.png")}
						style={styles.topIcon}
					/>
					<Text style={{ fontSize: unitWidth * 28, color: "#FA788A", marginBottom: unitHeight * 10 }}>恭喜您闯关成功！</Text>
					<Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>请选择您想要获得的奖励吧~</Text>
				</View>
				<View style={styles.btnList}>
					<View style={styles.btnItem}>
						<Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>获得关主的手机号</Text>
					</View>
					<View style={styles.btnItemRed}>
						<Text style={{ fontSize: unitWidth * 28, color: "#fff" }}>查看关主的生活照</Text>
					</View>
					<View style={styles.btnItem}>
						<Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>和关主一起玩推理游戏</Text>
					</View>
					<View style={styles.btnItem}>
						<Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>自定义</Text>
					</View>
				</View>
			</View>
		)
	}
}
const styles = StyleSheet.create({
	container: {
		flex: 1,
		alignItems: "center",
		paddingTop: unitHeight * 25,
		backgroundColor:"#fff"
	},
	topIcon: {
		width: unitWidth * 235,
		height: unitHeight * 210,
		marginBottom: unitHeight * 44
	},
	btnList: {
		alignItems: "center"
	},
	btnItem: {
		width: unitWidth * 502,
		height: unitHeight * 80,
		justifyContent: "center",
		alignItems: "center",
		backgroundColor: "#F2F2F2",
		marginBottom: unitHeight * 30,
		borderRadius: unitHeight * 80
	},
	btnItemRed:{
		width: unitWidth * 502,
		height: unitHeight * 80,
		justifyContent: "center",
		alignItems: "center",
		backgroundColor: "#FB788A",
		marginBottom: unitHeight * 30,
		borderRadius: unitHeight * 80
	}
})