Uni-app 中 rpx 用法

在开发过程中经常出现按设计搞上的尺寸写 最终在不同手机上显示不一样。经常被UI 怼

后来才知道 rpx 这种牛逼的单位，但是看官网写的换算方法有点懵

rpx 是相对于基准宽度的单位，可以根据屏幕宽度进行自适应。uni-app 规定屏幕基准宽度 750rpx。

开发者可以通过设计稿基准宽度计算页面元素 rpx 值，设计稿 1px 与框架样式 1rpx 转换公式如下：

设计稿 1px / 设计稿基准宽度 = 框架样式 1rpx / 750rpx

换言之，页面元素宽度在 uni-app 中的宽度计算公式：

750 * 元素在设计稿中的宽度 / 设计稿基准宽度

。。。。。

仔细看重点 uni-app 规定屏幕基准宽度 750rpx。

用图来介绍 这个设计稿的 宽度是 375px

这个组件宽度 330px

所以在 uni-app 中 应该是 750 * 330 / 375 = 660rpx