样式表：
cententWrap{
flex:1;
flex-direction:column;
}
cententNav{
flex-direction: row;
height: 20;
margin-left: 5;
margin-top: 5;
margin-right: 5;
}
cententNavText{
width: 60;
font-size: 14;
color: #9C9C9C;
margin-left: 10;
}
新闻主题方面可以划分为左右两栏，左栏固定宽，右栏占满，由于react-native不支持overflow:scroll属性，这里会用到一个ScrollView的滚动条组件来展示新闻概述，篇幅可能较长，底部就不再编写了（就是懒~~），大家各自完善吧，以下是全部的布局代码和样式。
页面结构：
render: function() {
// var repeatArr = Array(100).join("1").split("")
var cententNav = ['头条', '热点', '娱乐', '体育', '财经'],
NEW_DATA = [
{
img: "http://www.easck.com/new1.png",
title: "李克强宴请上合各参会领导人",
content: "称会议阐释了上合组织“大家庭”的深厚友谊和良好氛围",
typeImg: "http://www.easck.com/new-type1.png"
},
//.....类似数据
];
return (
<View style={styles.wrap}>
<View style={styles.top}>
<Text style={styles.topTitle}>网易</Text>
</View>
<View style={styles.cententWrap}>
<View style={styles.cententNav}>
{
cententNav.map(function(el, index){
return <Text style={styles.cententNavText}>
<Text style={index == 0 ? styles.textR : ""}>{cententNav[index]}</Text>
</Text>
})
}
</View>
<ScrollView style={styles.centent}>
{
NEW_DATA.map(function(el, index){
return (
<View>
<View style={styles.cententLi}>
<Image source={{uri: NEW_DATA[index].img}} style={styles.cententImg} />
<View style={styles.rightCentent}>
<Text style={styles.cententTitle}>{NEW_DATA[index].title}</Text>
<Text style={styles.cententCentent}>{NEW_DATA[index].content}</Text>
</View>
<Image source={{uri: NEW_DATA[index].typeImg}} style={styles.cententType} />
</View>
<View style={styles.line}></View>
</View>
)
})
}
</ScrollView>
</View>
<View style={styles.bottom}>
<Text style={styles.text}>
尾部信息
</Text>
</View>
</View>
);
}
