小程序完美适配自定义导航

主要两大核心接口:

  1.wx.getSystemInfoSync()  //获取系统信息(获取手机状态栏高度statusBarHeight)

  2.wx.getMenuButtonBoundingClientRect()  //获取菜单按钮(右上角胶囊按钮)的布局位置信息。坐标信息以屏幕左上角为原点(也就是通过获取胶囊相关信息得出导航栏高度)
  通过官方接口得出状态栏高度和导航栏高度

1 const sys = wx.getSystemInfoSync();
2 const capsule = wx.getMenuButtonBoundingClientRect()
3 // console.log(capsule)
4 const navHeight = (capsule.top - sys.statusBarHeight) * 2 + capsule.height
5 this.setData({
6   statusBarHeight: sys.statusBarHeight,  //状态栏高度
7   navHeight  //导航栏高度
8 })
posted @ 2019-12-13 13:53  小白是鱼骨头呀!  阅读(346)  评论(0编辑  收藏  举报