微信小程序开发 px转换rpx

前言：最近在编写一个uniapp开源项目时，由于没有UI设计稿就使用浏览器提供的手机调试工具，把项目切换到iphone6作为UI设计稿。
大家都知道UI设计师一般都是以750宽度作为视觉稿的标准。接下来先让我们了解一些概念然后再来了解rpx转换px的换算。

像素：像素是图像的基本采样单位，它不是一个确定的物理量，因为像素点的物理大小是不确定的。

分辨率:分辨率是屏幕像素的数量，一般用屏幕宽度的像素点乘以屏幕高度的像素点。如描述iphone6的分辨率是750*1334。
分辨率又分为【物理分辨率】和【逻辑分辨率】，值得注意的是实际工作中设计师常常给的是物理分辨率，程序中用到的是逻辑分辨率，但是都称为分辨率，容易混淆。

物理分辨率：是硬件所支持的分辨率
逻辑分辨率:是软件可以达到的分辨率。

iphone6的分辨率写着375 x 667，这里指的就是它的逻辑分辨率。我们上面提的750 x 1334则是它的物理分辨率。

接下来我们在了解几个单位：

px:px就是Pixel的缩写，就是指像素。

rem:在做移动端适配是最常用的方法就是使用rem作为单位，因为rem是根据html的fontsize去动态计算实际的px的,所以我们经常根据屏幕大小动态的设置fontsize.来达到不同的分辨率下有一样的效果。

rpx:rpx其实是微信对于rem的一种应用的规定，或者说一种设计的方案，官方上规定屏幕宽度为20rem，规定屏幕宽为750rpx

总结：
所以选择375作为UI设计稿，因为750是375的2倍。这样我们只要根据这个比列就能算出在750上面的宽高了。
计算公式：设计稿测量出的元素像素乘以比值=设计稿测出的元素px所要转换的rpx