import React, { Component } from "react"
import { StyleSheet, Text, View, ImageBackground } from "react-native"
import { unitWidth, unitHeight } from "../utils/AdapterUtil";
import MyButtom from '../component/MyButton'

export default class GameLead extends Component {
    toHomePage = () => {
        const { navigation } = this.props;
        navigation.navigate("BottomTabNavigator")
    }
    toGamePage = () => {
        const { navigation } = this.props;
        navigation.navigate("BottomTabNavigator")
    }
    render() {
        return (

            <ImageBackground source={require('../../static/gameLead.jpg')}
                style={styles.container}
            >
                <View style={styles.btnArea}>
                    <MyButtom
                        onPress={this.toHomePage}
                        text={"去游戏"}
                        width={unitWidth * 502}
                        height={unitHeight * 84}
                        borderRadius={unitHeight * 84}
                        bgColor="#FA788A"
                        shadowBgc="rgba(250,120,138,1)"
                        style={{ fontSize: unitWidth * 32 }}
                    />
                    <MyButtom
                        onPress={this.toGamePage}
                        text={"回主页"}
                        width={unitWidth * 502}
                        height={unitHeight * 84}
                        borderRadius={unitHeight * 84}
                        bgColor="#fff"
                        shadowBgc="rgba(250,120,138,1)"
                        style={{ fontSize: unitWidth * 32, color: "#FB788A" }}
                    />
                </View>

                <View style={styles.textInfo}>
                    <Text style={styles.text}>亲爱的XXX，欢迎进入XXX，来游戏大厅和大家一起尽情玩耍吧，在这里遇到志同道合的伴侣几率为95%哦，一起来吧</Text>
                </View>

            </ImageBackground>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: "center",
        justifyContent: "flex-end"
    },
    btnArea: {
        height: unitHeight * 212,
        justifyContent: "space-between"
    },
    textInfo: {
        width: unitWidth * 558,
        height: unitHeight * 123,
        marginBottom: unitHeight * 85,
        marginTop: unitHeight * 213
    },
    text: {
        fontSize: unitWidth * 28,
        color: "#fff",
        lineHeight: unitHeight * 35
    }
})