微信小程序开发之rpx和px的单位互转

2019-07-09 09:51:57 浏览：9782 作者：倔强的巴顿

在日常的小程序开发过程中，难免会遇到需要适配或者动态计算某个view容器高度的问题。比如，滑动一定高度后需要置顶的菜单栏。如果，使用微...

在日常的小程序开发过程中，难免会遇到需要适配或者动态计算某个view容器高度的问题。

比如，滑动一定高度后需要置顶的菜单栏。

如果，使用微信官方提供的监听页面滑动事件（onPageScroll）的API方法，此时获得的scrollTop属性的单位为 px 。

微信小程序开发之rpx和px的单位互转

而我们的wxss代码里的计算单位默认都是 rpx ，这就需要我们在处理该功能时，将监听页面滑动得到的 px 值，同步换算为 rpx 单位，来保证后续功能的准确性。

so，下面就提供一个相当便捷的rpx和px之间单位换算的方法：

const px = rpx / 750 * wx.getSystemInfoSync().windowWidth;

const rpx = px * 750 / wx.getSystemInfoSync().windowWidth;

注：

wx.getSystemInfoSync() 方法说明如下图，或可至官方API获取详细说明。

微信小程序开发之rpx和px的单位互转

共 0 条评论

微信小程序开发之rpx和px的单位互转_多骨鱼