React Native布局篇（1）

探究RN中默认单位代表什么

1.首先看一段代码

var Dimensions = require("Dimensions");
var PixelRatio = require("PixelRatio");
export default class App extends Component<{}> {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          window.width={Dimensions.get("window").width + "\n"}
          window.height={Dimensions.get("window").height + "\n"}
          pxielRatio={PixelRatio.get()}
        </Text>
      </View>
    );
  }
}

通过 Dimensions 获取屏幕的宽度和高度，通过 PixelRatio 获取放缩比例，获取结果如下：

window.width=360
window.height=640
pxielRatio=3

看到ＲＮ给出的宽高，我情不自禁的想晒出小米５手机的分辨率和ｄｐｉ

width= 1080px=360*3=window.width*pxielRatio
height= 1920px=640*3=window.height*pxielRatio
density=480dpi

160dpi的屏幕上，1dip=1px。在安卓中480dpi对应的缩放系数=480/160=3，与pxielRatio获取的缩放系数相同。
在安卓中，1dp=缩放系数 px,即在480dpi中屏幕密度下，1dip=3px；在RN中，假如默认单位也是dp，那么缩放系数也刚好是3，同样也满足1dip=3px；因此我们可以知道，RN中的默认单位就是安卓中的dp；

苹果手机单位换算，单位等同于pt，详细请参考
https://www.imooc.com/article/1626