微信小程序自定义导航高度和右上角胶囊按钮对齐方案

628 阅读1分钟

index.png

方案:调用uni.getMenuButtonBoundingClientRect()方法获取右上角胶囊的定位信息,通过bottom属性获取距离顶部的距离,就能拿到高度了,单位处理统一用px

index.png

// 获取胶囊按钮信息,长宽高和定位,如果做自定义navbar需要高度和胶囊高度对齐美观可以用此方法,单位处理统一用px。 
setCapsuleHeight: () => { 
    const info = uni.getMenuButtonBoundingClientRect(); 
    return info.bottom + 10; // 这里+10代表10下间距 
}