View是一个容器，支持FlexBox布局。
View既可以作为容器容纳其他组件，也可以作为一个组件包含进另一个容器中。
无论运行在哪个平台上，View都会直接对应这个平台的原生视图，如iOS中的UIView、Android中的android.View，以及HTML中的<div>。
下面是一个View的使用案例的代码：
import React, { Component } from ‘react‘;
import {
AppRegistry,
StyleSheet,
View
} from ‘react-native‘;
class MyApp extends Component {
render() {
return (
<View style={{ flexDirection: ‘row‘, height: 100, padding: 20 }}>
<View style={{ backgroundColor: ‘blue‘, flex: 0.5 }} />
<View style={{ backgroundColor: ‘red‘, flex: 0.25 }} />
<View style={{ backgroundColor: ‘green‘, flex: 0.25 }} />
</View>
);
}
}
const styles = StyleSheet.create({});
AppRegistry.registerComponent(‘MyApp‘, () => MyApp);
从上面的代码中可以看到，render()函数中返回了一个View，这个View中又包含了三个子View。三个子View各有填充颜色，并且占据父View的一定比例的空间。
以上代码的运行效果如下图所示：
使用View时需要注意的地方：
render()函数只能返回一个View或View的子类，不能返回多个并列的View！
| Style标签 | 说明 |
|---|---|
| borderColor | 边框颜色，这边几个就是代表上下左右边框的颜色（borderTopColor，borderRightColor，borderBottomColor，borderLeftColor） |
| borderStyle | 边框线的风格，这个和CSS样式是一样的，enum（’solid’,’dotted’,’dashed’） |
| opacity | 设置透明度 |
| elevation | 高度，设置Z轴，可以产生立体效果 |
| backgroundColor | 颜色 |
| borderRadius | 边框圆角大小，其他几个是上下左右边框的圆角.borderTopLeftRadius,borderTopRightRadius,borderBottomLeftRadius,borderBottomRightRadius |
| borderWidth | 边框宽度，另外四个是上下左右的边框宽度：borderTopWidth，borderLeftWidth，borderBottomWidth，borderRightWidth |
| overflow | 设置超过容器内容显示与否 |
原文：http://www.cnblogs.com/itgungnir/p/6443714.html