react-native code之路
使用Flexbox布局
容器的属性
1、Flex Direction
在组件的
style中指定flexDirection可以决定布局的主轴。子元素是应该沿着水平轴(row)方向排列，还是沿着竖直轴(column)方向排列呢？默认值是竖直轴(column)方向。
2、Flex Wrap
3、Justify Content
在组件的
style中指定justifyContent可以决定其子元素沿着主轴的排列方式。子元素是应该靠近主轴的起始端还是末尾段分布呢？亦或应该均匀分布？对应的这些可选项有：flex-start、center、flex-end、space-around以及space-between。
4、Align Items
项目的属性
1、Flex
2、Align Self
react-native原生控件
Text
一个用于显示文本的React组件，并且它也支持嵌套、样式，以及触摸处理。在下面的例子里，嵌套的标题和正文文字会继承来自
styles.baseText的fontFamily字体样式，不过标题上还附加了它自己额外的样式。标题和文本会在顶部依次堆叠，并且被代码中内嵌的换行符分隔开。
属性
adjustsFontSizeToFit bool
指定字体是否随着给定样式的限制而自动缩放。
allowFontScaling bool
控制字体是否要根据系统的“字体大小”辅助选项来进行缩放。
ios minimumFontScale bool
当adjustsFontSizeToFit开启时，指定最小的缩放比（即不能低于这个值）。可设定的值为0.01 - 1.0
numberOfLines number
用来当文本过长的时候裁剪文本。包括折叠产生的换行在内，总的行数不会超过这个属性的限制。
testID string
用来在端到端测试中标记这个视图。
ios suppressHighlighting bool
当为true时，如果文本被按下，则没有任何视觉效果。默认情况下，文本被按下时会有一个灰色的、椭圆形的高光。
style
color color
fontFamily string
fontSize number
fontStyle enum('normal', 'italic')
fontWeight enum('normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')
指定字体的粗细。大多数字体都支持'normal'和'bold'值。并非所有字体都支持所有的数字值。如果某个值不支持，则会自动选择最接近的值。
lineHeight number
textAlign enum('auto', 'left', 'right', 'center', 'justify')
指定文本的对齐方式。其中'justify'值仅iOS支持，在Android上会变为left
textDecorationLine enum('none', 'underline', 'line-through', 'underline line-through')
textShadowColor color
textShadowOffset {width: number, height: number}
textShadowRadius number
android includeFontPadding bool
Android在默认情况下会为文字额外保留一些padding，以便留出空间摆放上标或是下标的文字。对于某些字体来说，这些额外的padding可能会导致文字难以垂直居中。如果你把
textAlignVertical设置为center之后，文字看起来依然不在正中间，那么可以尝试将本属性设置为false.
android textAlignVertical enum('auto', 'top', 'bottom', 'center')
ios fontVariant [enum('small-caps', 'oldstyle-nums', 'lining-nums', 'tabular-nums', 'proportional-nums')]
ios letterSpacing number
ios textDecorationColor color
ios textDecorationStyle enum('solid', 'double', 'dotted', 'dashed')
ios writingDirection enum('auto', 'ltr', 'rtl')
TouchableOpacity
本组件用于封装视图，使其可以正确响应触摸操作。当按下的时候，封装的视图的不透明度会降低。这个过程并不会真正改变视图层级，大部分情况下很容易添加到应用中而不会带来一些奇怪的副作用。（译注：此组件与TouchableHighlight的区别在于并没有额外的颜色变化，更适于一般场景）
例子：
renderButton: function() {
return (
<TouchableOpacity activeOpacity={0.5}
onPress={this._onPressButton}>
<Image
style={styles.button}
source={require('image!myButton')}
/>
</TouchableOpacity>
);
},
属性
activeOpacity number
指定封装的视图在被触摸操作激活时以多少不透明度显示（通常在0到1之间）
