flower-mp/utils/util.js
2025-12-29 17:32:10 +08:00

28 lines
847 B
JavaScript

// utils/util.js
/**
* 获取胶囊按钮的布局位置信息
* 用于对齐自定义导航栏
*/
export const getNavLayout = () => {
// 1. 获取胶囊位置信息
const menu = wx.getMenuButtonBoundingClientRect();
// 2. 获取系统信息(为了计算右侧间距)
const system = wx.getSystemInfoSync();
// 3. 计算左侧间距(为了和右侧胶囊对称)
// 屏幕宽度 - 胶囊右边界 = 胶囊距离屏幕右边的距离
const gap = system.windowWidth - menu.right;
return {
// 直接生成可用的 style 字符串
// 容器 style: 紧贴胶囊顶部,高度一致,左边距对称
containerStyle: `top: ${menu.top}px; height: ${menu.height}px; left: ${gap}px;`,
// 如果你需要单独的数值,也返回出去
top: menu.top,
height: menu.height,
gap: gap
};
}