123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310 |
- import React, { Component } from "react"
- import { StyleSheet, View, Text, Image } from "react-native"
- import { unitWidth, unitHeight } from "../utils/AdapterUtil";
- import RNPickerSelect from 'react-native-picker-select';
- import AntDesign from "react-native-vector-icons/AntDesign"
- export default class MyInfo extends Component {
- render() {
- return (
- <View style={styles.container}>
- <View style={styles.titleTip}>
- <AntDesign
- name={"pay-circle1"}
- size={20}
- style={{ color: "#FA788A", marginRight: unitWidth * 12 }}
- />
- <Text style={{ color: "#FA788A", fontSize: unitWidth * 28 }}>完成10项资料后,你才会被系统推荐给他人</Text>
- </View>
- <View style={styles.formArea}>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>头像</Text>
- <View style={styles.itemRight}>
- <Image
- source={require("../../static/userPhone.png")}
- style={styles.userIcon}
- />
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>姓名</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>张晓明</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>性别</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>女</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>出生日期</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>1990-01-01</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>居住地</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>山东省烟台市莱山区</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>身高</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>170cm</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>体重</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>55kg</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>行业</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>互联网行业</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>年收入</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>15-20w</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- <View style={styles.formItem}>
- <RNPickerSelect
- placeholder={""}
- onValueChange={(value) => console.log(value)}
- items={[
- { label: 'Football', value: 'football' },
- { label: 'Baseball', value: 'baseball' },
- { label: 'Hockey', value: 'hockey' },
- ]}
- >
- <View style={styles.itemArea}>
- <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>兴趣爱好</Text>
- <View style={styles.itemRight}>
- <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>it</Text>
- <AntDesign
- name={"right"}
- size={20}
- style={{ color: "#999999", marginLeft: unitWidth * 22 }}
- />
- </View>
- </View>
- </RNPickerSelect>
- </View>
- </View>
- </View>
- )
- }
- }
- const styles = StyleSheet.create({
- container: {
- flex: 1,
- alignItems: "center"
- },
- titleTip: {
- width: "100%",
- height: unitHeight * 84,
- backgroundColor: "#FCF2F6",
- flexDirection:"row",
- alignItems:"center",
- paddingLeft:unitWidth * 24,
- },
- formArea: {
- width: "100%"
- },
- formItem: {
- width: "100%",
- height: unitHeight * 97,
- backgroundColor: "#fff",
- marginBottom: unitHeight * 6,
- },
- itemArea: {
- width: "100%",
- height: "100%",
- flexDirection: "row",
- justifyContent: "space-between",
- alignItems: "center",
- paddingLeft: unitWidth * 23,
- paddingRight: unitWidth * 24,
- borderBottomColor: "#F9F9F9",
- borderBottomWidth: 1
- },
- itemRight: {
- flexDirection: "row",
- alignItems: "center"
- },
- userIcon: {
- width: unitWidth * 66,
- height: unitHeight * 66
- }
- })
|