小程式使用動畫時的 px 單位 轉 rpx的方法

2021-09-05 12:11:27 字數 588 閱讀 6234

1、需要借助的api:wx.getsysteminfosync();

通過api可獲取的值:

// 在 iphone6 下執行:

var systeminfo = wx.getsysteminfosync();

console.log(systeminfo.windowwidth); // 輸出 375(單位 px)

// 在 iphone6 plus 下:

var systeminfo = wx.getsysteminfosync();

console.log(systeminfo.windowwidth); // 輸出 414 (單位 px)

2、px與rpx之間轉換的公式:px = rpx / 750 * wx.getsysteminfosync().windowwidth;

動畫中如何使用:

//假設我想向右平移300rpx,動畫**如下:

this.animation.translatex(300 / 750 * systeminfo.windowwidth).step()

這樣在所有機型上都可以進行適配。

小程式使用動畫時的 px 單位 轉 rpx的方法

wx.getsysteminfosync 通過api可獲取的值 在 iphone6 下執行 var systeminfo wx.getsysteminfosync console.log systeminfo.windowwidth 輸出 375 單位 px 在 iphone6 plus 下 var...

微信小程式 單位rpx與px之間的轉換

可以根據螢幕寬度進行自適應。規定螢幕寬度為750rpx.2 個人示例測試 假設我們需要乙個寬為200px,高為200px這樣的a元素模組 我們分別在iphone5和iphone6上測試px與rpx之間的轉換。iphone5 在iphone5上1px等於2.34rpx,那麼200 2.34 468rp...

微信小程式 rpx單位的理解

如何理解rpx?rpx responsive pixel 可以根據螢幕寬度進行自適應。規定螢幕寬為750rpx。如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx 375px 750物理畫素,1rpx 0.5px 1物理畫素。小測試 1 rpx 全稱是什麼?請填寫英...