From a8bcda1f7ca0de46f6c99e1d59c258ab6099d415 Mon Sep 17 00:00:00 2001 From: wangjiahai <1556608@qq.com> Date: Mon, 4 Dec 2023 10:29:46 +0800 Subject: [PATCH] 1111 --- common/nav-calc-utils.js | 42 +++++++++++++++++----------------------- 1 file changed, 18 insertions(+), 24 deletions(-) diff --git a/common/nav-calc-utils.js b/common/nav-calc-utils.js index f61c0b3..8dfaccf 100644 --- a/common/nav-calc-utils.js +++ b/common/nav-calc-utils.js @@ -1,6 +1,16 @@ function navParams() { let params = { + // 胶囊 + menuButton: { + width: 0, + height: 0 + }, + // 导航栏 + navBar: { + paddingTop: 0, + paddingBottom: 0 + }, // 导航栏整体高度:状态栏+导航啦 navHeight: '0px', // 状态栏高度 @@ -18,36 +28,20 @@ function navParams() { let info = uni.getSystemInfoSync(); // 状态栏高度 - params.statusBarHeight = info.statusBarHeight + params.statusBarHeight = info.statusBarHeight; - // todo 首个页面不能用自定义的导航栏,否则数据不对,遗留问题 - // 获取胶囊高度 + // 获取胶囊相关内容 // 以下示例数据都 来自 iPhoneX 75%大小的微信模拟器 // #ifdef MP-WEIXIN let menuButton = uni.getMenuButtonBoundingClientRect(); - // 胶囊高度32 实际应该为 80像素 - let menuButtonHeight = menuButton.height; - // 整体屏幕的高度 - 可用的高度 = 状态栏+导航栏+底部导航栏(部分手机虚拟返回按键) - // 状态栏+导航栏 88 实际220 - let navHeight = info.screenHeight - info.windowHeight; - // 小程序胶囊底部的纵向坐标 80 实际为200像素 - let menuButtonBottom = menuButton.bottom; - // 胶囊底部距离导航栏底部的间距为8 实际为20像素 - let menuButtonVerticalPadding = navHeight - menuButtonBottom; - // 胶囊右侧距离屏幕右侧的间距为7 实际为17.5(18)像素 - let menuButtonHorizontalPadding = info.screenWidth - menuButton.right; - // 导航栏可用最大高度 48 实际 120 - let navMaxUseHeight = navHeight - statusBarHeight - // 导航栏paddingRight 101 实际252.5(253)像素 - let navPaddingRight = menuButton.width + menuButtonHorizontalPadding * 2 - - params.unit = 'px' - params.navHeight = navHeight + params.unit - params.navUseHeight = navMaxUseHeight + params.unit - params.navVerticalPadding = menuButtonVerticalPadding + params.unit - params.navPaddingRight = navPaddingRight + params.unit + params.menuButton.width = menuButton.width; + params.menuButton.height = menuButton.height; + params.navBar.paddingTop = menuButton.top - params.statusBarHeight; + params.navBar.paddingBottom = params.navBar.paddingTop * 2; // #endif + console.log(params); + return params }