141 - 修炼 - 小程序的知识点10

你好呀，这里是怀英的小茶馆。今天和你聊聊rpx。

你可能会比较好奇，之前我们一直聊的的是WXSS，怎么突然聊起了rpx了？rpx是啥，这两者有关系么？

rpx就是微信对显示像素做了一层封装，好处是可以根据屏幕宽度进行自适应。这里引入了一个新的概念---显示像素。手机的显示屏是以像素点为最基本的显示单位，然后通过三原色的不同组合，在局部地区形成特定地颜色，再通过成千上万地这样的区域，形成相应地色块区域。再通过这些色块区域组成一幅画面。微信对像素px做了一些特殊的封装与定义，使其更合适于小程序的开发。简单来说，最最重要的一条修改是，微信将任何屏幕的宽度都设置为750rpx，并基于rpx与px(像素)的比值，进行全图的相应绘制。

我一开始接触750这个值的时候，挺好奇的，想知道它是怎么来的。看到微信开发文档中对rpx的介绍，感觉它应该是以iPhone6为原型进行定义的。原文中有这么一句话的定义，如下：

如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。

以iPhone6的经典程度，用iPhone6做视觉稿的标准将会是一个不错的选择。

这里是怀英的小茶馆，有空来坐坐。