home

js/navigator/AppNavigators.js

@@ -11,6 +11,26 @@ import ForgetPassWord from "../page/ForgetPassWord"
 import HomePage from "../page/HomePage"
 
 const InitNavigator = createStackNavigator({
+    LoginPage:{
+        screen:LoginPage,
+        navigationOptions:{
+            header:null
+        }
+    },
+    WelcomePage:{
+        screen:WelcomePage,
+        navigationOptions:{
+            header:null
+        }
+    }
+})
+const MainNavigator = createStackNavigator({
+    HomePage:{
+        screen:HomePage,
+        navigationOptions:{
+            header:null
+        }
+    },
     Meet:{
         screen:Meet,
         navigationOptions:{
@@ -47,32 +67,14 @@ const InitNavigator = createStackNavigator({
             header:null
         }
     },
-    LoginPage:{
-        screen:LoginPage,
-        navigationOptions:{
-            header:null
-        }
-    },
-    WelcomePage:{
-        screen:WelcomePage,
-        navigationOptions:{
-            header:null
-        }
-    }
-})
-const MainNavigator = createStackNavigator({
-    HomePage:{
-        screen:HomePage,
-        navigationOptions:{
-            header:null
-        }
-    }
 })
 export default createAppContainer(createSwitchNavigator({
-    Init:InitNavigator,
-    // Main:MainNavigator
-},{
+    // Init:InitNavigator,
+    Main:MainNavigator
+},
+{
     navigationOptions:{
         header:null
     }
-}))
+}
+))

js/page/MainPage.js

@@ -1,20 +1,60 @@
 import React from "react"
-import { View ,Text,StyleSheet} from "react-native"
-
-export default class MainPage extends React.Component{
-    render(){
+import { StyleSheet, Text, View, ImageBackground } from "react-native"
+import { unitWidth, unitHeight, getStatusBarHeight } from "../utils/AdapterUtil";
+export default class MainPage extends React.Component {
+    render() {
         return (
             <View style={styles.container}>
-                <Text>MainPage</Text>
+                <ImageBackground source={require('../../static/homeMatch.png')}
+                    style={styles.topBgc}
+                >
+                    <Text style={styles.bgcText}>你会不会催好朋友还钱？</Text>
+                </ImageBackground>
+                <View style={styles.itemArea}>
+                    <Text style={styles.itemText}>A 不催，催账可能产生不必要的隔阂</Text>
+                </View>
+                <View style={styles.itemArea}>
+                    <Text style={styles.itemText}>B 催，珍惜彼此的信用</Text>
+                </View>
+
             </View>
+
         )
     }
 }
 const styles = StyleSheet.create({
-    container:{
-        flex:1,
-        justifyContent:"center",
-        alignItems:"center",
-        backgroundColor:"#f00"
+    container: {
+        flex: 1,
+        paddingTop: getStatusBarHeight() + unitHeight * 30,
+        paddingLeft: unitWidth * 60,
+        paddingRight: unitWidth * 60,
+        alignItems: "center",
+        position: "relative"
+    },
+    topBgc: {
+        width: unitWidth * 702,
+        height: unitHeight * 160,
+        justifyContent: "center",
+        alignItems: "center",
+        paddingTop: unitHeight * 20,
+        marginBottom: unitHeight * 40
+    },
+    bgcText: {
+        fontSize: unitWidth * 36,
+        color: "#fff"
+    },
+    itemArea: {
+        width: unitWidth * 702,
+        height: unitHeight * 108,
+        borderColor: "#ccc",
+        borderWidth: 1,
+        borderRadius: unitHeight * 10,
+        marginBottom: unitHeight * 40,
+        justifyContent: "center",
+        paddingLeft: unitWidth * 40
+    },
+    itemText: {
+        fontSize: unitWidth * 28,
+        color: "#333333"
     }
 })