react-native 布局

1.flexbox

React Native中的Flexbox的工作原理和web上的CSS基本一致,有部分不同

1. 根级不用写 display:flex(直接flex:number)
2. flexDirection 的默认值是 column (web css 为row)
3. flex 只能指定一个值
4. 不支持属性：align-content，flex-basis，order，flex-basis，flex-flow，flex-grow，flex-shrink

2.字体适配

原则上就是基于 iOS 和Android的像素密度和宽高进行等比缩放

var deviceWidth //设备window width
var defaultWidth //设计宽度
var fontSize //设计 字体大小

//缩放比 可以同时参考高度
var scale = deviceWidth / defaultWidth;

var getFontSize=function(fontSize){
    var size=fontSize*scale;
    return size
} 
//剩下就是加上ios android 的字体大小响应的计算模式