uniapp 常用高度状态栏，导航栏，tab栏，底部安全高度
实际效果
使用
//使用
let posConfig = this.getPosConfig(); // 传false返回值为 px大小
console.log(posConfig.safeBottomH)
// 入参 是否转换为rpx
getPosConfig(toRpx = true) {
const systemInfo = uni.getSystemInfoSync();
// #ifdef MP
const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
// #endif
const posConfig = {
statusBarH: systemInfo.statusBarHeight,//状态栏高度
tabBarH: systemInfo.screenHeight - systemInfo.windowHeight,//底部tab高度
safeBottomH: systemInfo.safeAreaInsets.bottom,//底部安全高度
// #ifdef MP
capsuleH: menuButtonInfo.height, //胶囊高度
capsuleW: menuButtonInfo.width, //胶囊宽度
capsuleGap: menuButtonInfo.top - systemInfo.statusBarHeight, // 胶囊到状态栏的间隔
customBarH: menuButtonInfo.height + (menuButtonInfo.top - systemInfo.statusBarHeight) * 2, //自定义导航栏高度
customBarW: menuButtonInfo.left, // 自定义导航栏宽度
// #endif
}
if (toRpx) {
const ratio = 750 / systemInfo.windowWidth;
for (let key in posConfig) {
posConfig[key] *= ratio;
}
}
return posConfig;
}