首页静态OK

+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ * @flow
+ */
+
+import React, { Component } from "react";
+import { AppRegistry, StyleSheet, Text, View, TouchableOpacity, Image, ScrollView } from "react-native";
+
+export default class NewsList extends Component {
+  render() {
+    return (
+      <ScrollView style={styles.container} automaticallyAdjustContentInsets={false}>
+        <ListItem title={"平安保险2017版"} context={"600万医疗报废，自费药，进口药，器材费"} />
+        <ListItem title={"平安保险2017版"} context={"600万医疗报废，自费药，进口药，器材费"} />
+        <ListItem title={"平安保险2017版"} context={"600万医疗报废，自费药，进口药，器材费"} />
+        <ListItem title={"平安保险2017版"} context={"600万医疗报废，自费药，进口药，器材费"} />
+      </ScrollView>
+    );
+  }
+}
+
+class ListItem extends Component {
+  render() {
+    return (
+      <TouchableOpacity style={styles.itemContainer}>
+        <View style={styles.itemImgWrapper}></View>
+        <View style={styles.itemRightWrapper}>
+          <Text style={styles.itemTextTop}>{this.props.title}</Text>
+          <Text style={styles.itemTextBottom}>{this.props.context}</Text>
+        </View>
+      </TouchableOpacity>
+    )
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    height:150,
+  },
+  itemContainer: {
+    height: 90,
+    backgroundColor: "#fff",
+    flexDirection: 'row',
+    alignItems: "center",
+    borderTopWidth: 1,
+    borderTopColor: "#EEEEEE",
+    borderStyle: "solid",
+    paddingLeft: 13,
+    paddingRight: 13,
+  },
+  itemImgWrapper: {
+    width:74,
+    height:66,
+    backgroundColor: "#ccc",
+    marginRight: 12
+  },
+  itemRightWrapper: {
+    justifyContent: "center",
+    height: 66,
+    flex: 1
+    // marginRight: 13
+  },
+  itemTextTop: {
+    fontSize: 16,
+    color: "#202020",
+    lineHeight: 21
+  },
+  itemTextBottom: {
+    fontSize: 13,
+    color: "#7A7A7A",
+    lineHeight: 18
+  },
+});

 import React, { Component } from "react";
 import React, { Component } from "react";
 import { AppRegistry, StyleSheet, Text, View, Image, TouchableOpacity } from "react-native";
 import { AppRegistry, StyleSheet, Text, View, Image, TouchableOpacity } from "react-native";
 import Carousel from "../../Components/Carousel";
 import Carousel from "../../Components/Carousel";
+import NewsList from "./NewList";
 
 
 export default class Main extends Component {
 export default class Main extends Component {
 
 
@@ -12,22 +13,19 @@ export default class Main extends Component {
     return (
     return (
       <View style={styles.container}>
       <View style={styles.container}>
         <Carousel />
         <Carousel />
-        {/* <Text style={styles.welcome}>首页</Text> */}
-        <TouchableOpacity onPress={() => {this.props.navigator.push()}} style={styles.midContainer}>
+        <TouchableOpacity style={styles.midContainer}>
           <Image source={require('../../assets/首页的副本/pic.png')} style={{width:72, height:18}} />
           <Image source={require('../../assets/首页的副本/pic.png')} style={{width:72, height:18}} />
           <Text style={styles.midText}>平安保险2017版</Text>
           <Text style={styles.midText}>平安保险2017版</Text>
         </TouchableOpacity>
         </TouchableOpacity>
         <View style={styles.textContainer}>
         <View style={styles.textContainer}>
-          <Text>保险头条</Text>
+          <Text style={styles.minText}>保险头条</Text>
         </View>
         </View>
+        <NewsList /> 
       </View>
       </View>
     );
     );
   }
   }
 }
 }
 
 
-
-// this.props.navigator.push()
-
 const styles = StyleSheet.create({
 const styles = StyleSheet.create({
   container: {
   container: {
     flex: 1,
     flex: 1,
@@ -35,7 +33,6 @@ const styles = StyleSheet.create({
     justifyContent: "flex-start",
     justifyContent: "flex-start",
     alignItems: "stretch",
     alignItems: "stretch",
     backgroundColor: "#EFEFEF"
     backgroundColor: "#EFEFEF"
-
   },
   },
   midContainer: {
   midContainer: {
     height: 45,
     height: 45,
@@ -58,7 +55,7 @@ const styles = StyleSheet.create({
     height: 45,
     height: 45,
     justifyContent: "center",
     justifyContent: "center",
     paddingLeft: 13,
     paddingLeft: 13,
-    fontSize: 15,
-    color: "#202020",
+    // fontSize: 15,
+    // color: "#202020",
   }
   }
 });
 });