设置

js/navigator/AppNavigators.js

@@ -14,6 +14,7 @@ import GirlFrienfTerm from "../page/GirlFrienfTerm"
 import GiftPay from "../page/GiftPay"
 import UserAgree from "../page/UserAgree"
 import Suggestion from "../page/Suggestion"
+import Setting from "../page/Setting"
 
 const InitNavigator = createStackNavigator({
     LoginPage:{
@@ -30,6 +31,12 @@ const InitNavigator = createStackNavigator({
     }
 })
 const MainNavigator = createStackNavigator({
+    Setting:{
+        screen:Setting,
+        navigationOptions:{
+            headerTitle:"设置"
+        }
+    },
     Suggestion:{
         screen:Suggestion,
         navigationOptions:{

js/page/Setting.js

@@ -0,0 +1,143 @@
+import React, { Component } from "react"
+import { StyleSheet, View, Text } from "react-native"
+import { unitWidth, unitHeight } from "../utils/AdapterUtil";
+import RNPickerSelect from 'react-native-picker-select';
+import AntDesign from "react-native-vector-icons/AntDesign"
+import MyButtom from '../component/MyButton'
+
+export default class Setting extends Component {
+    render() {
+        return (
+            <View style={styles.container}>
+                <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>
+                                <AntDesign
+                                    name={"right"}
+                                    size={24}
+                                    style={{ color: "#999999" }}
+                                />
+                            </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>
+                                <AntDesign
+                                    name={"right"}
+                                    size={24}
+                                    style={{ color: "#999999" }}
+                                />
+                            </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>
+                                <AntDesign
+                                    name={"right"}
+                                    size={24}
+                                    style={{ color: "#999999" }}
+                                />
+                            </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>
+                                <AntDesign
+                                    name={"right"}
+                                    size={24}
+                                    style={{ color: "#999999" }}
+                                />
+                            </View>
+                        </RNPickerSelect>
+                    </View>
+                </View>
+                <View style={styles.bottomBtn}>
+                    <MyButtom
+                        text={"退出登录"}
+                        width={unitWidth * 502}
+                        height={unitHeight * 84}
+                        borderRadius={unitHeight * 84}
+                        bgColor="#FA788A"
+                        shadowBgc="rgba(250,120,138,1)"
+                        style={{ fontSize: unitWidth * 32 }}
+                    />
+                </View>
+            </View>
+        )
+    }
+}
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        paddingLeft: unitWidth * 23,
+        paddingRight: unitWidth * 23,
+        alignItems: "center"
+    },
+    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
+    },
+    bottomBtn: {
+        width: "100%",
+        marginTop: unitHeight * 196,
+        height: unitHeight * 84,
+        justifyContent: 'center',
+        alignItems: 'center'
+    },
+})