px与rpx关系与换算方法
2023-04-18 14:28:48 时间
小程序开发使用rpx 作为度量单位,rpx与px之间换算关系与屏幕宽度有关。
一、小程序开发文档中有对rpx的说明:
我的理解是,将不论什么尺寸的屏幕横向均分750份,将屏幕横向分辨率除以750。
如iphone5: 分辨率 320*568
rpx转px 计算:320/750 = 0.426666
px转rpx 计算:750/320 = 0.234375
具体各型号分辨率可点击小程序开发工具左上方查看:
二、转换方法
1. rpx 转换为 px ,传参类型是数字(Number)
// rpx 转换为 px ,传参类型是数字(Number)
export function rpxTopx(rpx) {
let deviceWidth = wx.getSystemInfoSync().windowWidth; //获取设备屏幕宽度
let px = (deviceWidth / 750) * Number(rpx)
return Math.floor(px);
}
2. px转rpx,传参类型是数字(Number)
// px 转换为 rpx ,传参类型是数字(Number)
export function rpxTopx(px) {
let deviceWidth = wx.getSystemInfoSync().windowWidth; //获取设备屏幕宽度
let rpx = (750 / deviceWidth) * Number(px)
return Math.floor(rpx);
}
1二、小程序开发时注意
1. 使用iphone6页面开发
iphone6分辨率是375*667,与rpx换算正好是2倍关系,便于单位计算
2. 长宽高建议使用偶数,减少出现边缘模糊,毛刺现象
3. 当需要获取 多个元素高度相加计算时,需要先分开转换计算再相加,因为会涉及四舍五入问题
相关文章
- 直接在代码里面对list集合进行分页
- .NET Framework 4.5新特性详解
- 大数据的简要介绍
- 大数据的由来
- 高斯混合模型的自然梯度变量推理
- timing-wheel 仿Kafka实现的时间轮算法
- 使用Navicat软件连接自建数据库(Linux系统)
- 那一天,我被Redis主从架构支配的恐惧
- Redis 深入了解键的过期时间
- C#使用委托调用实现用户端等待闪屏
- 基于流计算 Oceanus 和 Elasticsearch Service 构建百亿级实时监控系统
- GRAND | 转录调控网络预测数据库
- JFreeChart API中文文档
- 临床相关突变查询数据库
- TIGER | 人类胰岛基因变化查询数据库
- 视频边缘计算网关EasyNVR在视频整体监控解决方案中的应用分析
- Apache Arrow - 大数据在数据湖后的下一个风向标
- 常见的电商数据指标体系
- AKShare-艺人数据-艺人流量价值
- MySQL中多表联合查询与子查询的这些区别,你可能不知道!