Info.js 3.58 KB
/**
 * Created by tdzl2003 on 12/18/16.
 */
import React, {Component, PropTypes} from "react";
import {
    Dimensions,
    Image,
    ScrollView,
    StyleSheet,
    Text,
    TouchableOpacity,
    View,
    Platform,
    StatusBar
} from "react-native";
import {zoomW,zoomH} from '../../utils/getSize';

function isIphoneX() {
    let dimen = Dimensions.get('window');
    return (
        Platform.OS === 'ios' &&
        !Platform.isPad &&
        !Platform.isTVOS &&
        (dimen.height === 812 || dimen.width === 812)
    );
}


var options = {
    title: '选择头像',
    storageOptions: {
        skipBackup: true,
        path: 'images',
        waitUntilSaved:true
    },
    cancelButtonTitle:'取消',
    takePhotoButtonTitle:'拍照',
    chooseFromLibraryButtonTitle:'选择相册',
    quality:1,
    noData:true,
    maxWidth: 200,
    maxHeight: 200

};

export default class Info extends Component {
    static navigationOptions = ({navigation}) => ({
        headerTitle:'个人信息',
        headerLeft:(
            <TouchableOpacity style={styles.backWrap} onPress={() => navigation.goBack()}>
                <Image source={require('../../img/back_gray.png')} resizeMode="contain" />
            </TouchableOpacity>
        ),
        headerRight:(
            <View></View>
        )
    });


    constructor(){
        super()
        this.state = {

        };

    }

    componentWillUnmount(){

    }

    componentDidMount(){

    }

    row(v,i){

        return (
            <TouchableOpacity style={[styles.row,(i===0||i===6)&&{marginTop:10},(i != 5 || i != 8)&&{borderBottomWidth:1}]}  key={i}
                              onPress={()=>{}}>
                <Text style={styles.title}>{v.name}</Text>
                {v.img&&<Image style={styles.img} defaultSource={require('../../img/personAvatar.png')}  resizeMode={'cover'}/>}
                <Text style={styles.text}>{v.text}</Text>
                <Image style={styles.icon} source={require('../../img/arrow_right.png')} resizeMode={'contain'}/>
            </TouchableOpacity>
        )
    }

    render(){

        return(
            <View style={styles.bg}>
                <StatusBar barStyle={'default'}/>
                <ScrollView >
                    {this.row({name:'头像',img:'1'},0)}
                    {this.row({name:'昵称',text:'张三'},1)}
                    {this.row({name:'性别',text:'男'},2)}
                    {this.row({name:'年龄',text:'29'},3)}
                    {this.row({name:'学历',text:'本科'},4)}
                    {this.row({name:'职业',text:'工程师'},5)}
                    {this.row({name:'党员认证',text:'无'},6)}
                    {this.row({name:'党支部认证',text:'无'},7)}
                    {this.row({name:'组织认证',text:'组织名称'},8)}

                </ScrollView>
            </View>
        )
    }
}
const styles = StyleSheet.create({
    backWrap: {
        justifyContent: 'center',
        paddingLeft: 18.5/zoomW,
        paddingRight: 18.5/zoomW,
        height: 44/zoomH,
    },
    back: {
        width: 8.5/zoomW,
        height: 15/zoomH,
    },
    bg:{
        flex:1,
        backgroundColor:'#f6f6f6',
    },
    row:{
        height:44/zoomH,
        flexDirection:'row',
        paddingHorizontal:15/zoomW,
        alignItems:'center',
        borderBottomColor:'#dddddd',
        backgroundColor:'white'
    },
    title:{
        fontSize:16,
        color:'#4b4b4b',
        flex:1
    },
    text:{
        color:'#8c8c8c',
        fontSize:14,
        marginRight:14/zoomW
    },
    img:{
        width:31/zoomW,
        height:31/zoomW,

    }
});