微信小程序从入门到弃坑(补充说明):关于rpx的解惑
使用iphone6作为调试界面?
基本概念:
英寸:表示屏幕斜对角的长度,如下图所示
像素是图像的基本采样单位,它不是一个确定的物理量,因为像素点的物理大小是不确定的。
--分辨率:分辨率是屏幕像素的数量,一般用屏幕宽度的像素点乘以屏幕高度的像素点,iphone的分辨率是750*1334 分辨率又分为物理分辨率和逻辑分辨率,实际工作中设计师常常给的是物理分辨率。程序用到的是逻辑分辨率,但是都称为分辨率,容易混淆
物理分辨率是硬件所支持的分辨率,逻辑分辨率是软件可以达到的分辨率
物理分辨率和逻辑分辨率的商称为【像素倍率dpr】也就是常说的几倍屏
例:iphone的分辨率是375*667,这里是它的逻辑分辨率。上面提到的750*1334则是它的物理分辨率
所以iphone6的像素倍率为(750*1334)/(375*667)=2
常用到的单位
【px】就是pixel的缩写,指像素,这个作为图片采样的基本单位
【rem 】在做移动端适配是最常用的方法就是使用rem作为单位,因为rem是根据html的fontsize去动态计算实际的px的
常常利用这点,即根据屏幕大小动态的设置fontsize来达到不同的分辨率下有一样的效果
【rpx】rpx其实施微信对于rem的一种应用的规定,或者说一种设计方案。
设计师标注的尺寸一般是物理分辨率
例:在iphone6上屏幕宽度为375px,共有750个物理像素,则750rpx=375px=750物理像素
1rpx=0.5px=1物理像素
微信小程序中,将设备宽度定义为750rpx,是以iphone6的分辨率(750x1334)
因为设计师标注的尺寸一般是物理分辨率,所以1如果以iphone6位标准出设计稿的话,那么就可以不需要经过换算直接标准rpx