uniapp小程序自定义顶部导航栏高度适配
短信预约 -IT技能 免费直播动态提醒
目录
自定义导航栏介绍：
一般用于图片等的填充或者其他特殊需求，如果使用纯色填充顶部栏可以直接使用navigationBarBackgroundColor完成
page.json文件:
"navigationBarBackgroundColor": "#FED000"效果：
自定义导航栏的使用
step1：取消默认的原生导航栏
page.json文件page的style中添加代码
"navigationStyle":"custom"step2：在页面中添加占位元素
占位高度包括：
评价 onLoad() { // 状态栏高度 this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight; // 胶囊数据 const { top, height } = wx.getMenuButtonBoundingClientRect(); // 自定义导航栏高度 = 胶囊高度 + 胶囊的padding*2, 如果获取不到设置为38 this.barHeight = height ? height + (top - this.statusBarHeight) * 2 : 38;},来源地址：https://blog.csdn.net/WX_nbclass/article/details/130126878
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
