React Native布局篇总结

总结

1. react 宽度基于pt为单位， 可以通过Dimensions 来获取宽高，PixelRatio 获取密度，如果想使用百分比，可以通过获取屏幕宽度手动计算。
2. 基于flex的布局
   1. view默认宽度为100%
   2. 水平居中用alignItems, 垂直居中用justifyContent
   3. 基于flex能够实现现有的网格系统需求，且网格能够各种嵌套无bug
3. 图片布局
   1. 通过Image.resizeMode来适配图片布局，包括contain, cover, stretch
   2. 默认不设置模式等于cover模式
   3. contain模式自适应宽高，给出高度值即可
   4. cover铺满容器，但是会做截取
   5. stretch铺满容器，拉伸
4. 定位
   1. 定位相对于父元素，父元素不用设置position也行
   2. padding 设置在Text元素上的时候会存在bug。所有padding变成了marginBottom
5. 文本元素
   1. 文字必须放在Text元素里边
   2. Text元素可以相互嵌套，且存在样式继承关系
   3. numberOfLines 需要放在最外层的Text元素上，且虽然截取了文字但是还是会占用空间